UI/UX Design Process Overview

UI/UX design includes a wide range of methodologies to ensure that an end product achieves its core (often business) objectives whilst providing its users with the most efficient and engaging experience possible. UX is best to be thought of as the beginning of the design cycle, it's where your mission is to understand in detail what problem you're trying to solve for your users. First identify the problem, then work on the solution. Together with the actual visual user–interface design of a website or application, the focus remains on the user's experience and interaction.


Often, the interface design (UI) is intertwined with the experience design (UX), but they are entirely different. However, I personally see both fields as a whole. User experience is comprised of both functionality and visibility, but when addressing the two as linked fields, it's obvious that one relies on the other.

The experience makes the website or product, not the features, and the goal of a UI/UX designer is to make users effective. True UX is the constant improvement for the better.

The goal of an interactive and visual designer is to make users effective, therefore my initial approach is to find out what problems (pain points) exist, and understand how users deal with them currently, and start working on solutions. Empathy is the foundation of the whole design thinking process, and ties directly to the primary principle, wherein you actually conduct research and interact with the people you're trying to help. The goal is to define the overall information architecture in order to plan the layout and interaction of the interface through a simulation of real use cases. The most important and obvious thing to determine is whether users are able to accomplish their tasks and goals, and to ensure they're able to do so in the best and most efficient way possible.

I am personally a proponent of the “Lean UX” methodology with less emphasis on deliverables and greater focus on the actual experience being designed. This means all of your resources should be focused on planning, designing, developing, and delivering a remarkably well-crafted core experience.

Carefully plan and document requirements for each project or related-task, which will be instrumental for conceptualizing, designing, creating and improving the overall web presentation. In addition, some common documentation such as sketches, wireframes, task-flow diagrams, and design specifications influence intermediate and advanced deliverables such as storyboards, detailed mockups and even rapid prototyping. What's unique about this stage is that for most of the deliverables, the documentation is the design.

The design process (phase) will help to turn ideas into an actual quality user experience delivering great concepts. The key is that documentation should help move the design forward. Simply put, it's all about making documentation complementary rather than supplementary to the design process.

White space helps guide the user experience. We use white space to create focus points for our users drawing their attention to certain elements. The greater the padding around a particular element on a page, the greater the emphasis on that element.

UI/UX Competencies

  1. Define the Product Vision
  2. UX Research and Analysis
    • Analytics
    • User Interviews and Surveys
    • Empathy Maps (includes accessibility)
    • Customer Journey Maps
  3. Collaboration (brainstorming and ideation)
    • Communication Skills
    • UX Writing
    • Visual Communication
  4. Wireframing (interaction design)
  5. High-Fidelity Mockups
  6. Rapid Prototyping (coding)
  7. Usability Testing
  8. Test and Validate

The experience makes the website or product, not the features – by marrying business goals with user needs, and working to define an experience that engages your target audience and drives them to action. Again, I embrace design thinking to combine the problem-solving roots of design with deep empathy for the user.

The great thing about working in the web space is the number of options to choose from, but it comes down to establishing your own well-structured and organized set of processes that fosters communication and a collaborative design culture. To that end, I follow the core principles of UI design that includes clarity, flexibility, familiarity, efficiency, consistency and structure.


Design System

A design system brings together branding, color, tone of voice, typography, animation, data visualization, and more to form the design language that powers your brand. The incentive for building a design system is to align the foundations of a brand's design language, streamline UX processes, and create a scalable UI language that allows designers to make better decisions and develop ideas faster.