I was recently involved in a staff augmentation project with one other DockYarder. The project involved us working at our client’s office for approximately three months. Aside from a shift in daily culture and a completely different perspective on the project’s challenges, I did discover a couple very, very simple techniques I’ll be exploring further in the future.
While my fellow DockYarder was tasked with user interface work for an existing application build, my task was to research, conceptualize, and design a full fledged careers section of a website. This website is the marketing tool for a greater web service. It’s aimed at new users and represents the breadth of what the service and its suite of tools and programs has to offer. What it failed to provide was a way for the client to recruit and entice prospective employees, which they would need in order to fill an immense amount of positions that were opening up in multiple locations.
A lot of my time on this project was spent in research and brainstorming concepts, which meant a lot of data harvesting and sketching. The results, prior to executing visual design, came in the form of Content Frames (a term I’ll explain in a later post). Using qualitative and quantitative research, we were able to quickly determine a viable layout and hierarchy option for the careers section. We did this without any content having been developed by the client. In fact, there was zero content at this point! Backwards sounding? Perhaps to some. That’s not what I’m going to discuss though. Instead I want to note just two simple techniques that made a strong impact on how the team communicated, and eventually on how we were able to begin prototyping without content.
Sketch with ink
The first technique is to use ink when sketching. I use a set of Micron pens for various design tasks away from the screen. I’ve recently begun sketching all of my lower fidelity wireframes with them. Why? Because drawing out my wireframes is a therapeutic process. It allows me time to further think about what I’m executing in the moment.
The varying weights also allow me to quickly suggest element context (buttons are a thicker 0.8mm line while images are 0.5 for example). Also because ink is permanent. This challenges my mind to make more calculated decisions in what I’m sketching and it disallows my cautious self to throw away or erase ideas that I put on paper. You never know how valuable a seemingly wrong idea might be later on.
Construct with paper, scissors, and tape
The second technique is utilizing the sketches to determine the content flow.
Instead of limiting my sketches to the size of the dot grid paper (or any boundary for that matter) I sketched the page as I saw it in its full length, running on to a new piece of paper when needed. At the end I simply taped them together. The results were full page sketches that allowed the client to see the content holistically and sequentially, rather than parsed in a series of sketchbook pages, or having to continuously scroll multiple artboards on screen.
If you have multiple concept sketches for the page, like I did, use scissors to cut and paste your concepts’ components together. Do this with the client. In fact, have the client do the cutting and taping. It emphasizes involvement, provides the client a sense of authority, and allows for the entire team to immediately rearrange, reorganize or compile their feedback and ideas by cutting and retaping components to one another. After just one meeting, we were left with a new page concept. It was derived from, and composed of, components from two of the four concept sketches we started with.
There’s something refreshing about incorporating materials into an approach. Everyone felt more connected, more involved, and frankly more confident with the work as we progressed. Granted the circumstances and constraints of my particular situation allowed for me to experiment with my process in this way. But I’d argue it’s always worth considering alternative routes in the creative process when the situation allows for it.
