Sitemap

UX Design Workflow as a Web Developer

4 min readMar 1, 2023
Cordillera Foods Project Overview and Duration

Introduction

As a full-stack web developer, learning about UX Design has been an interest of mine as it helps me gain a better understanding of the web application project life cycle from design to development. Prior to becoming a full-stack web developer by attending a Web Dev Bootcamp, I was already taking the Google UX Design Professional Certification in Coursera. And through this journey, I have gained perspective on why good design is crucial in the web development process.

UX Design Workflow and Example Scenario

In case you are wondering where I am taking my Professional Certification for Google UX Design, I am taking it in Coursera -a global online learning platform that offers anyone, anywhere, access to online courses and degrees from leading universities and companies. The course involves research and analysis, ideation, prototyping, user testing, iteration, and implementation. These phases are essential to creating a user-friendly, intuitive, and aesthetically pleasing digital product.

And as I complete this Professional UX Design Certification by Google, I have developed a workflow that I follow to approach each UX design project effectively. This workflow involves the following steps:

  1. Ideation: In this step, we brainstorm and sketch out ideas to visualize and conceptualize the design. We explore different design concepts and evaluate their effectiveness in meeting the user’s requirements by doing some paper wireframes and doing crazy eight’s.
  2. Prototyping: The next step is to create digital wireframe and interactive mockups to test the design’s functionality and user experience. We use a prototyping tool to create a functional representation of the product that can be tested with users, in this case, Figma.
  3. User Testing: In this step, we conduct user testing to get feedback on the design’s usability and effectiveness. This feedback helps me identify areas that need improvement and informs the design’s iteration.
  4. Iteration: Based on the feedback of the usability study received during user testing, we make necessary changes to the design to improve its effectiveness and usability. This process is repeated until the design meets the user’s needs and requirements. Then conduct another Usability Study until the design is finalized.
  5. Implementation: Once the design is finalized, we move on to the implementation phase, where we create the final product. This involves coding and integrating the design with the required technologies and platforms.
  6. Evaluation: The final step is to evaluate the effectiveness of the design by conducting usability testing and analyzing user feedback. This helps identify areas that need improvement and informs the design’s future iterations.

For example, my case study on Cordillera Foods where the project is a restaurant food review app for food enthusiasts to discover and share local restaurant recommendations.

In the ideation phase, brainstorming and sketching help visualize and conceptualize the design. And during the research phase, user interviews, surveys, and usability testing helped me further identify user needs, pain points, and preferences. And lastly, after conducting some usability studies again, reiterating the low-fidelity and high-fidelity designs is necessary whenever there is critical feedback with regard to the UX/UI design.

So Why consider doing UX Design

A good UX Design can speed up the product development process by reducing the need for constant revisions and iterations, aka, scope creep that might hunt the developer. By identifying user needs and preferences early on in the design process, designers can create a product that caters to the user’s requirements, reducing the need for constant revisions and changes during the development phase.

Furthermore, having a background in UX design can also be beneficial for web developers, as it allows us to understand the design’s intent and purpose. By working closely with the product design and understanding the design’s goals, web developers can create a website that is not only aesthetically pleasing but also performs well and meets the user’s needs and requirements.

Mockup for Cordillera Foods

Conclusion

In conclusion, as a web developer, having a good design is essential in the product development process as it creates an effective user experience that engages and retains users. In addition, having a product design early on provides the bigger picture for the project. With this, I highly suggest taking the Google UX Design Professional Certification on Coursera which provides a structured approach to creating a user-friendly, intuitive, and aesthetically pleasing product. By understanding the importance and impact of good design and having a background in UX design and as a web developer, I can say that I can create websites that not only attract and retain users but also meet business objectives.

Thank you for taking the time to read this and reach the end. Below are links that you might find useful with regard to this article.

Checkout my Case Study: https://drive.google.com/file/d/1Hx2uqn483WpXs8SfYBgJQ8PNLkoumU8O/view?usp=sharing

Let’s Connect on LinkedIn: https://www.linkedin.com/in/hellojhonas/

My Link tree: https://linktr.ee/hellojhonas

Others: https://www.uxlibrary.org/

--

--

HelloJhonas
HelloJhonas

Written by HelloJhonas

A Fullstack Web Developer, UX/UI Designer, and Virtual Assistant based in Baguio City, Philippines.

No responses yet