We design & develop beautiful, user-centered applications for iOS, Android, & the web.

This is how we do it.

Discovery

The best apps solve a need for the users in a pleasant way. In the discovery phase, we examine the needs we are going to design for, and propose potential solutions.

Kickoff Meeting

At the Kickoff Meeting, our design team and your key stakeholders talk through your thinking on the project so far. Our clients all begin at a different stage in the process, so we use this time to evaluate what has been done so far on your project and plan out a roadmap for what needs to be completed to get you to a MVP (Minimum Viable Product).

Market Research

We take time to evaluate what others in the same space are doing; where they've succeeded and where they've fallen short, to discover design patterns common to the industry.

Planning

Before beginning visual design we plan out the project by creating user personas, user stories and a user flow map.

User Personas

We create a set of user personas to gain an understanding of the type of users that will be using the app, what motivates them, and what goals they would like to achieve when using the app.

User Persona Example

User Stories

Utilizing those personas, we create user stories that describe how each user persona will use the app, which ensures that all of the user goals will be met in the design.

As a parent of a student who is meeting regularly with an eduational mentor, I want to be notified if my child or her mentor cancels a meeting so that I can have peace of mind.
As a student who often struggles with taking adequate notes, I want to be able to directly contact my mentor at any time, so that I am not blocked until our next meeting.
As a mentor managing several students every semester, I want to have easy access to the conversations I’ve had with each student, so that when we meet, we can start where we left off.

User Flow Map

Once we have the users’ goals in mind, we develop a user flow map to plan out how users will achieve those goals in the application. This process can often reveal processes that need extra refinement. Conducting this exercise early on helps eliminate extensive revisions later in the prototyping phase.

Visual Design

Once planning is complete, we begin visual design, first by iterating on and selecting a style concept, then turning the selected concept into a style guide.

Style Concepts

We generally create three style concepts for you to choose from, each with its own unique look and feel. Prior to creating the concepts we review the marketplace specific to your business to gain an understanding of competitors products, and determine how we'll differentiate your product from theirs. We combine these findings with your existing brand guidelines and create the three style concepts.

Style Guide

The style guide is a document which sets standards for which colors, fonts, buttons, header styles, typography and other elements will be used, which ensures a unified, cohesive look across each section of the application. Our design and development teams routinely reference the style guide throughout the project.

Style Guide Example

High Fidelity Design and Prototyping

Once you've selected a style concept and we've built a style guide, we're ready to create high fidelity designs for each view of the app, which we load up into Invision to create a fully clickable prototype.

Blockframes

We begin high fidelity design by block-framing the main views of the app. Block-framing is a way of laying out each view without getting distracted by text and imagery. It's useful for:

  • Shape Created with Sketch. Rapid prototyping.
  • Shape Created with Sketch. Understanding functionality.
  • Shape Created with Sketch. Demonstrating the user flow map.
  • Shape Created with Sketch. Ensuring a solid underlying structure.

High Fidelity Prototyping

After we've built a solid user experience at the blockframe level, we design high fidelity mockups of every view and workflow of the app using Sketch and Adobe Creative Suite. We then compile the high fidelity designs into Invision, a prototyping tool that allows us to create a fully clickable, interactive version of the app that looks and feels like the finished app, which is useful for:

  • Shape Created with Sketch. User testing prior to development.
  • Shape Created with Sketch. Demonstrating functionality for developers.
  • Shape Created with Sketch. Discovering edge cases.
  • Shape Created with Sketch. Finalizing design prior to development.
Explore More Prototypes

Interactive Revisions

Trying to describe design revisions via email or over the phone is notoriously difficult, so we try to avoid it. Instead, we use Invision’s interactive revision tool which allows everyone on your team and ours to place comments directly in the app describing requested changes, which makes communication much easier and more transparent, and creates a written record of what was requested and agreed upon.

User Testing

Once the prototype is designed, we put it through a round of user testing. Our most common method is a moderated remote usability study. We build a set of tasks that the users should complete within the prototype, provide the user a short briefing if they are not familiar with the project, and observe the user complete the tasks by screen and video share. We then analyze the studies, make adjustments to the prototype, and repeat as necessary. The result is an efficient user testing process that allows for global collaboration.

Complete Web App Prototype Example

View Prototype

Development Handoff

A comprehensive handoff from the design team to the development team ensures that developers fully understand the application and have what they need to build it.

Prior to development beginning, the design team meets with the developers and reviews everything that was created during the design phase, including the market research summary, user personas, user stories, user flow map, style guide, high fidelity designs, and the clickable prototype. Additionally, the design team provides all of the required image and icon assets in the proper formats, and documents any interactions or workflows that are not properly demonstrated in the prototype. This systematic handoff ensures that developers have everything they need to proceed quickly and efficiently, without blockers.

Streamlined Administration

Throughout the project, you will have open communication with the designers and developers working on your project, you’ll receive daily progress reports on the work that was completed, and as the project moves from design into development, you will get a line item estimate that gives you an accurate timeframe and cost for the development phase of your project.

Transparent Communication

We invite every client to join us in a private Slack channel for their project where they can communicate directly with the designers and developers. This way, everyone involved stays up-to-date and informed on the progress and any potential issues.

Daily Progress Reports

Each day at noon you will receive a report summarizing the work that was completed the previous day, and month-to-date and year-to-date project totals for both time and cost. These daily updates help avoid surprises when you receive the bill, and helps keep expectations in line.

View Daily Hour Sheet

Line Item Estimation

Our comprehensive design process and the clickable prototype help everyone involved fully understand what will be built, which in turn allows us to create a detailed line-item estimate of the hours required to develop the app, and the associated cost. It's not possible to accurately estimate the cost to develop an app without first designing it, which is why a systematic design process is so important.

View Estimation Example

Let’s Talk!

We'd love to learn more about your project. Contact us below for a free consultation with our CEO.

FullStack Labs
This field is required
This field is required
Type of project
Reason for contact:
How did you hear about us? This field is required
Please verify you are not a robot