If all you have is a hammer…

The following post is a collection of tools that I use as to support my work as a digital designer at Automattic on the VIP Platform team.

I tend to favour fewer tools, less software, less clutter. I like to think that it helps to stop the spread of information across platforms, products and software that not all of my team may have access to.

This has become particularly important to me since switching to a different operating system at the start of 2017. Many of my old design files now require me to access them via propriety software in a virtual machine. If we consider the research and work we are producing to be important, then the content we generate needs to stand the test of time and the tools need to do the same.

Luckily I work for a company that believes in the power of open source and the importance of preserving information for future generations. I like to try and work with tools that share these same values if possible.

Discovery Tools

The discovery phase is all about understanding the problem in front of you. To me it is equal measures research and inspiration. There is plenty of overlap here with the listening tools listed towards the end of the post so feel free to skip down to that as well.

Books

A collection of design books sitting on a shelf

I have a small collection of design books that have earned a permanent space on my bookshelf. I tend to sell or pass on books once I have read them but those in the picture above are not going anywhere. Some highlights include:

A Browser

I spend a great deal of time in my browser, Chrome for work, Firefox for everything else. It is the ultimate research tool and also the gateway to many apps I use as well. Lately I have been testing hosting services and content management products to better understand the landscape of similar platforms and businesses. In particular I have been interested in services that are focused on the developer experience or enterprise markets.

A Pen and Paper

Notebooks are useful for collecting quick thoughts and ideas as they happen. I tend to have a pad and pen on my desk for jotting down sketches and notes. I tend to avoid pencils though, I am not a fan of that scratchy sound.

A Walk / Getting Out

I don’t do this enough as I should but it is important to get out and find inspiration from other places and think about problems from different perspectives. I recommend looking at other industries and their exhibitions / conferences.

P2

For internal communication we use the P2 WordPress theme which is an internal blog of sorts. It reduces the need for email and keeps all discussions asynchronous, central and searchable. P2 is great for sharing my research, thoughts and ideas with the rest of the team but could benefit from some improvements when it comes to getting feedback on design.

Wunderlist / Simplenote

I use Wunderlist for tracking all my actionable items as they arrive and Simplenote for typing up notes and posts (like this one) as I start to refine my words and thoughts.

Hypothesis Tools

Hypothesis is about testing ideas quickly. It is tentatively exploring all forks in the road before committing to any particular direction. The tools need to help you prototype and fail quickly. I like to make use of:

Mural

For getting a remote team to collaborate, Mural can be a huge help. We often use it alongside a Zoom call to generate ideas and think about problems our clients face with our service.

Wireframes

Either on paper or with an online tool like Wireframe.cc. Wireframes allow me to think about how related information can be grouped without getting bogged down the aesthetics of an idea. They are quick to generate and share as concepts.

Prototypes

If it is feasible I will try and prototype with code these days as it allows my team to move quicker into the delivery phase. I am still on the look out for a visual prototype tool and whilst my team has been experimenting with InVision I have yet to fully adopt it into my workflow.

Delivery Tools

This is where I have spent most of my time at Automattic as we have a small team with a huge road-map in front of us. Delivering a well crafted product is crucial to our team and our clients.

Figma

One application I miss from my Mac is Sketch. Luckily a colleague introduced me to Figma and I am really impressed so far. Figma is where I do most of my UI designs these days. It has shared libraries, works via a browser and they have started to introduce prototyping workflows as well. It is moving fast with a recently released phone application and support for Zeplin as well. I thoroughly recommend it.

Atom Editor

Atom is a text editor that’s modern, approachable and extremely hackable. It has some great extensions and is cross platform. One of my favourite new extensions is Teletype which allows for pair programming across the Internet. I am also a huge fan of the integrated Git tools. This is one of my most valuable tools.

Photoshop & Illustrator

Although my use of both these has decreased I still find Photoshop a great tool for manipulating my photographs and Illustrator useful for more advanced vector work. I have also been experimenting with Inkscape which has excellent support for the open SVG format.

Browser Extensions

When developing there are a number of handful browser extensions that validate design and development decisions such as the excellent aXe accessibility tester and Lighthouse for performance testing.

Listening Tools

Working remotely makes listening a little more challenging. It is not easy for me to grab a client for 10 minutes and run some ideas past them. We primarily rely on video and text.

We also have a number of different audiences to tune into on the VIP platform team, these include:

  • Our colleagues
  • Our clients (which can include many different teams within a large organisation)
  • Our development partners
  • Our plugin partners

Balancing the needs of all these potential users is an interesting challenge.

Zendesk

Zendesk is our primary support tool for VIP clients and is a great listening post for frustrations and reoccurring issues across the VIP platform. We have just began implementing a new tagging system in an attempt to find common issues which can inform our road map for future features. We can use volume of tickets in a particular tag as a measure of success as we roll out new features.

GitHub

GitHub issues are extremely useful for me when gathering feedback across many different code bases and applications. The all issues view is handy for me to see when problems are getting backed up.

Zoom

A few months ago we started to conduct client and developer interviews via Zoom in order to have a better connection with our users. This has been useful for understanding what the frustrations are from the many different user types we serve. Feedback from the interviews has been compiled into Google Sheets and used to inform our 2018 plans.

Honourable Mentions

There are a couple more tools I would like to quickly mention:

  • Sketchup – for 3D models and 3D printing, works via the web now too
  • Green Recorder – for recording my screen
  • Peek – for Gif creating
  • Kdenlive – for video editing which I hope to do more of in 2018
  • Postman – for API testing
  • Alva – Component library management and collaboration (early days)

And that is my list! If you come across any open source, cross platform design tools that I haven’t covered then please share them in the comments below.

Photo by Todd Quackenbush on Unsplash.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s