Designing

We follow a human-centered design process in which the roles of developer and designer are blended together.

We believe that developers should be designers, and designers should be developers. By combining the roles we make user experience the responsibility of the entire team rather than a single member.

We want to avoid too many design documents that do not translate directly into prototypes that users can try out. We don't find a serious loss in directly prototyping with HTML and CSS. Often its just as fast to put together a wireframe and add in layers of interaction later.

This faster iteration allows us to provide more value to our clients.

Process and tools

We follow a process that gets our clients the best result in the shortest amount of time. This means web projects are designed natively using the language of the web.

This ensures minimal friction and ease of access for users, no matter what technology they're using.

That means we recommend our clients start and build primarily for the web. Progressive web apps have come a long way in providing an adequate user experience for most apps that come our way.

If there is a need for more advanced interaction then we provide a smooth transition for porting web apps to native apps using the progressive web app as a base.

User experience first

When designing for a project we focus on the key users and the flows required for them to get the most important value out of a product.

Designs begin as low fidelity HTML/CSS mock-ups. They are then tested in front of stakeholders to gain trust and improve the planning of the following iteration.

The best beginning step is to study the context the product will be used in. The beginning of a project is the time to ask questions like:

• Who will be using this product and who will be paying for it?
• Where will they use this product? In the field? At a desk?
• What is the end user’s definition of a successful experience?
• How can we meet their expectations the fastest given the budget and timeline?

From there the team will diverge and develop separate ideas about implementing user flows.

Finally the team will converge on an optimal solution and present the results to stakeholders to get further feedback until our wireframe prototype requires anything else.

Usability testing

Early into the project we arrange usability testing with potential end users.

Good sources for users can come from:

• Client’s personal network
• Outreach to potential customers
• Amazon Mechanical Turk
• Friends and family

We conduct usability tests using any video calling software that supports screen sharing and some screen recording. Developers are present during tests and host discussions after to incorporate feedback into the roadmap.

User interface design

When designing for an interface we start with a core component for each feature.

We believe all components should start with the idea of solving something like displaying information, allowing an action, and so on. They should not start from the idea of being something, like a dropdown, a menu, etc.

By treating websites as a collection of components we can get an emergent design that is more closely adapted to the needs of the end user.

To kick things off, we will start a brand new feature by creating a moodboard on Notion. This is a good time to get feedback from stakeholders about the brand.

The design is initiated with a wireframe design system using utility first CSS and plain HTML.

We then group important information into displayable components and lay them out on a single page. Components are collected into a hierarchy and interactivity is introduced to the interface.

We believe waiting for feedback should never stop or stall work, critique from stakeholders should be an asynchronous and continuous core to the design process.