Using Design Tools to Become a One-Man Design Team

Mar 31 2011 by Aaron Irizarry | 26 Comments

As designers, we can often find ourselves on a bit of an island. Whether we are working independently or at an in-house position, there are times when we are left to fill many job roles that merit an entire design team.

I recently experienced this situation at my previous job where I was a solo user experience designer at a company employing thousands of people. I had to do my own research, wireframes, prototyping, functional specs, visual design, etc. I had no team to help accomplish these tasks, but I still had deadlines as if I did.

On the one hand, it was a great experience to work in all of these different roles. On the other, I was rarely afforded the opportunity to focus in on one of these disciplines and perform it at the level I would have liked.

This is me, stressed out.

Does this describe you? Are you the lone designer working at a company tasked with accomplishing the many tasks that a team would normally tackle? Maybe you are working as a freelancer and certain projects need many of these roles to be filled to really produce an excellent result.

How do we handle multiple roles?

I propose we build our own team. A team consisting of you and design tools.

I will share with you how I used some very valuable (and relatively affordable) tools and resources to help me tackle a few different roles at a much higher level than if I was trying to do it all on my own.

I used four different tools and resources to help me in my struggle to produce well-informed solutions that met my deadlines.

These four things are data-gathering tools (ClickTale), design pattern galleries/libraries, wireframing/prototyping (Axure), and design resource sites (like Designmoo and 365psd).

You can swap out the specific tools I’ll be mentioning with your preferred tools and resources, but I wanted to share with you my personal setup as a proof-of-concept.

Tools Can’t Replace People

Before going any further, let me first say that working in a team environment is almost always more fruitful than trying to do all multiple roles on our own. But when you’re at a company that doesn’t have the budget to form a design team or are working independently as a freelancer, sometimes you just have to do the best with what you have, to ensure that the results are the best they can be.

With that said, let’s go over these four types of tools.

Data-Gathering Tools

Let’s start with ClickTale, a great research/analytics tool that shows you how users are interacting with your web pages. ClickTale allows you to track page views along with some basic analytics reports that you could get from a free alternative like Google Analytics. But its strength is in features like heat maps, click-tracking, scroll reach (how far down the page your users scroll), recorded sessions of users interacting with your site/product so you can see how they navigate your site, and some great web form analytics. Six Revisions uses ClickTale on the front page of this site.

ClickTale

I used this tool to help me with the research phase of my site projects. The detailed reports it gave me helped in discovering ways to improve our web page layouts and web application interfaces. I didn’t actually have to do the research; I just needed to sift through the very well prepared datasets it provided me.

With a tool like ClickTale, I was equipped with more knowledge about our users to help me either rework or create new designs based off of solid information about our customer base and how they interacted with our products.

Other tools like ClickTale are:

Design Pattern Libraries

Once I had data about how users experienced our existing products, it was time to rework website components such as site navigation, web page layout structures, the design of web forms, and so on — all in an effort to improve conversions based on what I had learned.

Often having to work under the gun and in constant deadline-dash mode, I found that it was helpful to use design pattern libraries as a guide to see how other designers have tackled the same design problems that I was faced with.

I also look at anti-patterns (which can be found on sites such as dark patterns) to double-check that my interfaces are built with the user’s best interest in mind.

Here are some design pattern libraries that I have found to be helpful:

It should be noted that design patterns do not replace the need for us to create the experiences based on our projects’ objectives and needs, but they serve as good references especially when we need a quick jumpstart.

Also, check out these articles if you are interested in learning more about design patterns:

Wireframing and Prototyping

For wireframing and prototyping, I use Axure. This application is a wireframing /prototyping tool that can generate functional HTML prototypes from your wireframes as well as produce functional specifications based on them. You can kill two birds with one stone by creating your wireframes and documentation at the same time!

Axure

This app has saved me gobs of time, and having functional prototypes instead of lifeless, static wireframes made with graphic design tools really helps with getting the clients to understand the flow of the application/site.

Functional prototypes are also very helpful in quick-and-dirty iterations and usability testing, allowing you to test the functionality and flow of things before you get to the visual design stage.

Of all of the tools and resources, this one was the most helpful to me.

To discover more wireframing tools, read this guide called Ultimate Guide to Website Wireframing. If you are not convinced that this phase of a design project is important, also read The Benefits of Wireframing a Design.

Design Resource Sites

Just as with design pattern libraries, I have found that visual design resource sites are crucial in fulfilling projects on time and within budget. My background is in visual design, but for someone who is a user experience designer or web producer that doesn’t have visual design as a skill, these resource libraries can be very beneficial.

To be honest, even as a visual designer with the required expertise, I need inspiration and starting points when I’m on tight deadlines. Many times, I don’t have the time or resources for creating custom design elements, so these sites can be a lifesaver.

Designmoo

Designmoo and 365psd are two sites that I have found to be super helpful. Not only can you find great design files on these sites, but each site also provides the opportunity for you to give back to the design community by allowing you to submit your own designs that others can use.

There are a lot of design resource sites out there, and it’s really up to you to find ones that fit your needs. Also, blogs provide freebies occasionally that you can also look into.

Parting Words

I hope you find these resources as useful as I have. Again, let me stress my earlier statement that these are tools and resources that can help you build a range of sites and applications, but no tool can replace real people with actual skills.

Don’t get discouraged when you feel outnumbered or overwhelmed by the amount of work on your plate. Look around for resources, and use the opportunity to crank out some awesome work even when it seems the odds are against you.

Do you have design tools and resources that have been helpful to you? Discuss them in the comments below.

Related Content

About the Author

Aaron Irizarry is a user experience/interaction designer for IGN Entertainment in Costa Mesa, California (where it’s always right around 70 degrees and sunny). He has a background in visual design and has been handcrafting pixels since 1998. He shares his thoughts and experiences on his blog thisisaaronslife.com. Follow Aaron on Twitter @aaroni268.

26 Comments

Victor

March 31st, 2011

Hi there,

Great post! Do you have common javascript libraries or CSS resets that have designed yourself or often use? Just something so when you move to the next project you’re not re-inventing structure, but to focus on the design portion?

Thanks.

Mark Bruce

March 31st, 2011

you have good collection for Design Pattern Libraries . I would like to mention about the Design framework like 960grid system and also I really like the http://balsamiq.com/ for wire-frame building, it is really simple application

Joel Finnström

March 31st, 2011

What a great post, I find myself in a similar position and I too use these tools frequently. One thing that I also tend to use a lot with our customers is the business model canvas made by: http://www.businessmodelgeneration.com/ It’s a great way to find the different markets and needs a certain client has.

Tjerja Geerts

March 31st, 2011

Great article Aaron!. What seems missing is icon/stencil files for example that you can use with Axure (or omnigraffle) which could help to further detail wireframes / buttons quickly. This has saved me loads of time in the end. (No more thick functional design documents, just wireframes/mockups.) Besides that, lorem ipsum generators (there are various online) help with ‘dummy content’ to give the whole some ‘body’. And as a final, don’t forget the photostock websites that help out in inspiration, but also conceptual approaches (keyword searches) and quick mockups. The designer’s spotlight from istockphoto.com is also great. keep up the great writing. much appreciated! :) Cheers, T.G.

David

March 31st, 2011

I am looking forward to learning more about this. I am happy I share a couple of these practices but am more excited about learning the ones I do not currently use. I work in a company that sounds just like the one you described. This article is great, thank you for sharing.

Adrian

March 31st, 2011

Short article, but good to read.
I think, if the people work in team, the project end much more effective.

Garth Humphreys

March 31st, 2011

Thanks for sharing this information. I fully understand and know what it’s like to be a One-Man Design/Development team, :( and having great tools at hand helps with some of the stress.

Philippe Alves

March 31st, 2011

I have used several times an online app called Cacoo (made in Japan) : Although it’s Flash based, it’s smooth, easy to handle and to use for fast wireframing. Plus, you can share it with friends online in real time, or export it into PDF. Hope this one is helpful to you all.

Thanks for the resources and guidance.

Chuck Tang

March 31st, 2011

Love your article and thanks so much for the tips!

You may already know this but http://www.vecteezy.com/ is my favorite site when I need vector resources. Like designmoo, it also allow you to share your work for others to use.

Cheers
Chuck

Valeria

March 31st, 2011

Really informative, thank you for all useful tips! First lines really captured my current situation: working alone as an invisible team is a bit challenging. Another good source for reading (when one is not pointed at with a gun loaded with deadlines) is always A list apart (http://www.alistapart.com).

Michael Tuck

March 31st, 2011

This article is particularly useful for the freelancer who finds him/herself having to be a “one man band.” Some great tool suggestions. Nice article, Aaron.

Mariusz Woźniak

March 31st, 2011

Thanks for sharing. I guess every designer builds his own toolbox over time – mine would be very similar (with Mixpanel for analytics and Balsamiq Mockups for very first stages of wireframing or simplier projects).

Chris Wallace

March 31st, 2011

Nice article Aaron! Thanks for mentioning Designmoo and 365psd!

Fraser Boag

March 31st, 2011

Some useful resources there, I hope to never become so overwhelmed as to need them all but nice to know they’re there just in case. :)

Armando E. Lopez

March 31st, 2011

I’m starting to be a web design free-lancer and this article taught me great things. Thanks :)

joanna sim

April 1st, 2011

Great post! I just started at a startup so this is invaluable. Btw, what has your experience been with clicktale in terms of affect on pageload time? Will it affect users’ experience?

Yassine Bentaieb

April 1st, 2011

Very nice article. Useful tips for freelancers that have a lot to deal with by themselves. I also like the summarizing format as opposed to a long article that keeps saying much of the same.

Thanks for the good read!

Christa

April 1st, 2011

Well done. It’s not easy to make it as a one-man (or woman!) design team but the tools can definitely help. I’ve heard about Crazy Egg but this convinces me to go actually try it out.

For me, Axure is just too expensive starting out. And I would argue that an online tool like Lucid Chart makes it easier to work with clients.

wdalhaj

April 2nd, 2011

Awesome and really useful post.I would like to add psdho.me where u can get free PSD files with different categories.

Josh Bedo

April 2nd, 2011

Good article ill have to check out axure I’ve tried other wireframing tools online and just found they were a waste of time and it was quicker to draw them out, but with axure it seems like a lot more things are possible. I also never knew about design pattern libraries ill check those out too.

Ranjit

April 5th, 2011

365psd.com is nice, Thanks..

Aaron Irizarry

April 5th, 2011

@Victor – i don’t have a set Javascript library or css framework I use.

@Chris – No Problem :)

Thank you everyone for taking the time to read the article, sharing your feedback, andadditional resources.

Christian Krammer

April 6th, 2011

Nice article. Honestly I wasn’t aware of Design pattern sites. Thanks for the tip.

Muhammed Awais

April 7th, 2011

Great Stuff, its really a great read for a One Man Show. All freelancers can benefit from such a wonderful article. Thanks Aaron.

Paulo72

April 9th, 2011

A really great article thanks. What I particularly enjoyed was that the scope was somewhat restricted and it didn’t include a hundred links to all of the various tools that one could use.

I wish more articles would take this more narrow/curated route rather than feeling compelled to throw in the kitchen sink.

Cheers,
Paul

se

May 22nd, 2011

Nice Article!

Leave a Comment

Subscribe to the comments on this article.