Brent on Mar 08, 2013
Brent is a designer for the Jog of War, a strategic running game. Sign up here for updates.
In this post, I’ll provide three ways you can speed up your design process. These are tried and tested methods, as you will see in the examples below. We put all of these into practice in the creation of Jog of War and the turn around on design iterations was the best we had experienced to date. We implemented many new processes when we began this project, but from a designer’s perspective, these were the three things that added the most in terms of speed efficiencies.
Set limitations for your work
If you’re a designer working amongst lots of developers you might have noticed a few things. This one in particular stands out in my mind. The nature of design work is very different from that of development work. The key difference being, developers have a defined end point in which they must solve many problems along the way to reach that point. Designers have one problem with no defined end point. That sounds great, you might say; you have the freedom to explore ideas, a multitude of different solutions, and only one problem to solve. Easy, right? Well, that depends.
If you are like most young-buck designers then you will jump right in, head-first without first taking a step back and doing your due diligence. This, however, is not always a successful or timesaving approach. It is a bit counter-intuitive, but if you put in the time to plan, restrict, and limit, you will actually save time in the long run. Your path becomes a little clearer, and the end result draws a little nearer.
This is how we limited ourselves with Jog of War. Determine what you want to accomplish. For us we wanted a functional app and we wanted it in the hands of beta-testers fast! This would validate for us whether we had a good idea or not. We did this by coming up with a Minimum Viable Product (MVP). We started by limiting the features, and then limiting them a bit more. Once we had a clearly defined MVP with a set feature list, we scoured the Internet for benchmarks.
Find benchmarks for design and style. By finding examples of similar visual communication styles, you can begin establishing the direction for your app, product, or do-dad. Designers be wary though. If your style too closely reflects another’s you may get caught up in a crossfire (see LayerVault vs. DesignModo). This process is more like establishing a mood board and setting the wheels in motion, not copying other’s solution.
Next, set a deadline. Don’t make a mountain out of a molehill. If people have too much time to do a project, the tendency is to make the project much larger then it really is. Stick to the essentials, do them well, and get them done in a timely manner. For Jog of War, the designs had to be shipped within two weeks so the developers could get moving.
Use style tiles
Now that you pulled back on the reins, you should be sitting pretty in the driver’s seat. For our project, we decided to try out style tiles (http://styletil.es). I had noticed in previous projects, I was spending a lot of time on designs which would ultimately be abandoned. (For discouraged designers, please note that this is not time completely wasted, as it is still time dedicated to improving your craft). More importantly, new screens, UX adaptations, and navigation alterations meant completely new mockups with new graphical assets. I felt we were asking too many important questions downstream, questions that could have been answered much earlier. The solution came in the form of style tiles.
Style tiles help establish a common visual language before getting started on the mockups. “Can we see what this would look like in purple” will no longer be such a painful question. Style tiles consist of fonts, colors, patterns and other interface elements. Now, when your team needs to add a new screen with various elements, it will be easy to borrow the asset from the style tile that you previously agree upon. I can’t stress the usefulness of this enough when working with a new mobile app. As you spend time making your app, even with the best planning, things change, and alterations need to be made on the fly.
Version 1 Style Tiles
Version 2.2 Style Tiles
You can download a stye tile template here (Style_Tile_Template.psd.zip).
Communicate with the client or project leader regularly
The third point is regular, clear, and open communication between the designer and the client or project lead. I’m sure every designer has shared the experience of waiting days or even weeks for approval on designs. This can all be alleviated if you set the precedence at the beginning to have regular communication. By doing this the client can monitor and also control the progress of the project. For you as a designer, this means you won’t waste time pursuing dead-ends or waiting for the go-ahead.
Since Jog of War was an internal project. The communication happened between the project leader and the designer. In our processes we used GitHub Issues as one of the primary ways to communicate. This allowed the project lead to view each new change and comment on specific aspects of the design. By versioning each revision, we could track the progress of the designs and easily refer to previous designs if need be. In addition to GitHub we also met regularly in the office and spoke on HipChat when one of us was out. At any rate, it does not matter what tool you use, but the important thing is to communicate regularly. This could look like a 15 minute phone call, Skype call, or classic face-to-face collaboration everyday. It really depends on the dynamics of your specific project.
I hope this you found this post helpful. If you have any questions don’t hesitate to ask. Don’t forget to check back in for more insights into the design and development of Jog of War. And of course, follow us on Twitter and sign-up so we can keep you updated.