My process for designing software products

Part I

Throughout my design career that spans just over a decade, I’ve had many conversations about a process designers of all types utilize to deliver their best work. I started my career as a self-taught designer, specializing in communication design; building websites for a wide range of businesses, designing promotional materials for printed media, and creating complete visual identities for new enterprises.

Understanding Your Audience

I cannot stress enough how important it is to really understand the people who are supposed to benefit from using a software product. It’s crucial to understand their habits, existing workflows, and how they think about problems. This will affect not only what your product aims to address but also how. In order to build great software, a channel of communication with the users of your product should be open at all times.

Problem Definition

Whether your and your team are designing a new feature of an existing product or a completely new product, it’s absolutely crucial to make sure that the problem your are attempting to solve for consumers is well defined.

Business Objectives and Design

In my current role at LeadGenius, I’m often involved in strategic product discussions with the founders where high-level product objectives are outlined and definitive KPIs (Key Performance Indicators) are set. In my previous roles, more often than not, high-level strategic decisions that inform product roadmaps were made without my direct involvement.

Part 2

This article will cover all of the components that fit into my design process. That being said, no process should be set in stone. Depending on the product and its stage of development, these components can be modified or completely taken out of the process. Building software is not a linear process. Sometimes design works in parallel with engineering, other times the two teams work in a staggered format. Sometimes I move right along with outlined processes, other times I have to take a step back, so the end result can be greater. I look at my design process as a preferred roadmap, one that’s flexible enough to adjust to the right cadence within every organization with a focus on building great products.

Organizing for Success

When a group of designers and engineers is working together, it’s imperative to make sure that everyone is always in sync. There is a great deal of interdependencies when it comes to tasks required to complete a feature. Carefully organizing these tasks across design and engineering provides transparency and allows product managers to track progress.

User Journeys and Feature Prioritization

Once a design team has a clear understanding of the problem that they are aiming to solve, and the KPIs that will measure success have been clearly defined, it’s time for product designers to start doing what they do best.

Initial UI Design

Once all of the internal stakeholders agree on global product features for the initial release, I begin to dive into interface details of each feature. This is where a great deal of heads down work happens either on paper or on screen. Every global feature has a number of smaller components that need to be identified. Let’s take a new project creation feature for our collaboration app mentioned a few paragraphs earlier. It consists of several smaller components that require design, and as I start sketching the main UI of that particular feature, I quickly make a list of these components. This list will help me remember what items require design. Sometimes I jump into sketching the smaller UI components right away, other times I go to the next global feature and repeat the process. As long as I have a list of smaller components that make up a global feature, I can be sure that nothing of importance is omitted.

Task Flows

Sometimes it makes sense to create detailed user task flows to communicate the architecture of the product and visualize all of the ways in which a user might navigate through the product. It’s especially helpful for complex products where users may take some unexpected turns, so to speak, and all edge cases must be accounted for in the architecture of the product to prevent unexpected software behavior.

User Experience in Wireframes

When all of the UI sketching is completed, I informally run some initial interface concepts by my teammates, and then I start flushing out and organizing these concepts. I primarily use Sketch to produce detailed wireframes quickly in digital format. At this stage, smaller UI details get attention, and a good deal of time is devoted to thinking about overall user experience. At this stage I start thinking about UI interactions and how to make these interactions fit into the overall user experience. I make a lot of notes on my wireframes to explain key interactions. I’ve found that these notes help me present my product thinking to the team during team meetings. I have also worked with plenty of remote teams who find great value in careful annotations that accompany my wireframes.

Usability Testing with Prototypes

Before an internal design review, it’s often useful to create low-fidelity prototypes to validate high-level product assumptions. In other situations, it makes sense to build these prototypes after the design review, in case the team finds it helpful to solicit additional feedback from the actual users of the product. Prototypes can take many shapes, and timing of prototype testing often determines what exactly is being tested.

Interactive and Visual Design

A great deal of thinking about macro-interactions happens during wireframing and prototyping stages. These interactions shape how people navigate through products. The design of micro-interactions usually happens much later in the process, and for me it happens almost in parallel with designing of visual elements. Many designers would agree that designing visual systems is a whole lot of fun. Designers get to weigh the pros and cons of numerous color palettes, explore a number of suitable fonts, experiment with interface layouts and eventually create style guides that co-exist with products as they mature.

Working With Engineers

I make it a priority to start collaborating with software engineers on the product team very early in the process. Depending on the organizational structure, I start a dialogue with engineers right after sketching the first versions of the interface. Getting early feedback from engineering in the past proved to be valuable and helped identify critical roadblocks early in the process. It should come as no surprise that it’s a good idea to involve engineers in discussions of high-level user flows of the features that are being built. Mapping and molding these flows together with the people who are in charge of implementing new features into the larger system makes sense because they have a much better understanding of how new components might fit into the existing structure without impeding overall performance or causing significant and unnecessary restructuring of the existing codebase.

User Testing

I partially addressed usability testing in paragraphs above, when describing my approach to prototype testing during the product design phase. I think it’s crucial to dedicate resources to receiving feedback from users as early as possible. It’s also equally important to conduct thorough usability testing after launching a product in beta, or releasing a feature to a limited audience. Companies with more resources sometimes conduct closed usability studies before releasing new products and features to a wider audience. They simply hire people to come in for usability testing sessions behind closed doors. These sessions are great for completely new products, because testing new features of existing products without larger product context is not the best approach to achieving accurate results.

Design Tools and Collaboration Platforms

My tool set varies only slightly with each company where I contribute as a product designer. Below is a list of tools that I have used in the past and use currently for design, user testing, and project management.

  • Sketch by Bohemian Coding is amazing for creating wireframes
  • Photoshop is my go-to app for visual design, sometimes I fire up Illustrator for iconography
  • InVision gets daily use to collaborate on designs at all stages
  • Marvel, Proto.io and Pixate for prototyping
  • Lately I’ve been using GitHub to track issues and manage projects
  • I’ve used Basecamp, Jira and RedBooth for project management
  • UserTesting.com for remote unmoderated user testing
  • Voila to record and edit screencasts from usability testing sessions

Technology enthusiast, product designer, entrepreneur, world traveler, patron of the arts, student of life...

Technology enthusiast, product designer, entrepreneur, world traveler, patron of the arts, student of life...