The Process of Product Design — Designing a Web Application

An example of design process from https://zurb.com/word/design-process

As a designer, the typical process of designing a product starts with conversations about business goals, high-level ideas, and eventually user stories. Turning concepts into user-friendly, intuitive, and polished designs is the job of a skilled product designer.

The magic is in the process. Getting from step A to Z means deliberately moving from one step to the next until the final product has been created. Then, heading back to the middle to improve designs in an endless loop of optimization.

This article is an overview of my design process for an admin console responsive website I designed for a client. My role was senior product designer, working on all aspects of design including UX, UI and visual design.

1. Conceptual handoff — high level business needs
2. User stories — digest and compartmentalize
3. Research —similar products and designs for inspiration
4. Wireframes — mobile views sketched by hand
5. Review and iterate
6. Visual design — develop styles
7. Review and iterate
8. Design screens — flows for desktop and mobile
9. Review and iterate
10. Development handoff — prepare files for Zeplin
11. Continue designing — menus, interactions, and lower priority flows
12. User feedback — beta testers and users feedback
13. Review and iterate

Wireframes — Sketches of mobile views as the first step of UI designs

InVision Project for desktop screen designs — showing various flows