So, what is UX/UI Design?
UX/UI Design is designing the user experience and user interface. Or, basically, designing your user’s journey throughout their entire use of your app or website.
Common elements of UX/UI design include designing the navigation, information architecture, workflow, and heuristics of your product. This should all be done as you’re making sure all of these elements abide by consistent and relatable branding that encompasses a look and feel that’s tailored to your users.
UX vs. UI Design
UX Design encompasses the overall, emotional experience your users have with your app or website—from usability, navigation, and workflow, to aesthetics and even customer service. Your goal is to make your app as easy-to-use and seamless and possible, to deliver your solution in the most tailored and effective way possible.
UI Design is a facet of your UX—which is why the two are so often confused. However, UI is an important, standalone element of your app in itself. UI entails the way color schemes and typography guide usability; how branding and aesthetics attract your users; and how buttons, images, text entry fields, and animations enhance the user journey (and conversion.)
DELIVERABLES
Information Architecture
- We create site maps and content hierarchies for element placement.
Design System
- We create a set of design standards and components to guide efficient design
Flow Maps
- We establish the flow—backend and frontend—of interaction with the product.
Low-Fidelity & High-Fidelity Wireframes
- We design and map out the look, feel, and functionality of the product.
What is the UX/UI Design process?
- Define the problem: Before we can move into any design, we need to understand why we’re doing it. This can only be done by clearly understanding the problem we’re trying to solve.
- Clearly define our users: We need to know for whom we’re solving the problem. The contextual things they might face in their day-to-day life can help us understand how to best make our product work for them. And although we discover these things in research, we need to clearly define them before we start building.
- Ideate: We utilize design practices like story mapping and sitemaps as the lowest fidelity versions of the product we’re building. These help us understand the complexity of the product and hash out important questions before we get into things like page layout and UI.
- Define the core feature set that will best solve the problem at hand: Once we understand the core functionality, we use user stories to hone in on what matters and cut the fluff distracting from the core experience.
- Low-fidelity wireframes: Once we understand the direction of the product and the general hierarchy, we start ideating what these actual pages look like. In this stage, we’re both trying to understand things like layout and what content goes where. However, this stage is also the next filter for complexity. Here, we can start to get a better understanding of all the content and subpages that will need to exist.
- High-fidelity wireframes/design system: At this stage, we put together all of the pieces in their full fidelity and complexity. We build out systems that make changes and hand-off to developers who can build out pages that can be utilized in usability tests.
What are common metrics for UX/UI improvements?
Common metrics to measure UX/UI improvements are:
+ Increases in conversion, task success, Net Promoter Score (NPS), System Usability Scale (SUS), and Customer Satisfaction (CSAT)
– Decreases in churn, abandonment, or task time.
UX/UI Best Practices
Some UX/UI best practices we follow are:
- Creating user stories at an early stage.
- Mapping out the project complexity before jumping into it.
- Constantly focusing on not only the design but the product goals.
- Recognizing that design is just another stage in development and that we aren’t siloed from our development team.
- Limiting scope and making what we hone in on matter.
