UI UX Design Roadmap

Write about the differences between UI and UX.

Get a certificate and Summarize what you learned.

Summarize what you learned.

Watch this video and apply behind him and create wireframe to this app → https://www.youtube.com/watch?v=7tC8b9pIqhY

Summarize what you learned. Analyze any website or app and identify the strengths and weaknesses in user experience.

Watch this video and apply behind him and create wireframe to this app → https://youtu.be/5ebUVh72wGc?si=rYeE3vmwEi919zF8

Watch this video and apply behind him and create prototype to this app → https://youtu.be/eM1534Fng6g?si=aThhQ8mf_9n532M1

Present the final project, explaining each stage they went through. Showcase the final prototypes and how users responded to them.

Write what steps we follow when thinking about solving a specific problem?

Design 3 Onboarding Screens to clothes app, focus on colors and typography.

What are the primary goals of your user experience research? What specific questions are you trying to answer?

State the difference between Qualitative & Quantitative Research.

Design Login and Sign Up Screens to Clothing app, Focus on spacing and icons.

1- Choose 3 people and do a user interview with them about the problem you previously identified in Design Thinking Task? 2- The designs you designed in the previous task, design them here but used website frame and make the web responsive.

1- Create variable button used by components ( with title and without, with icon and without icon, big and small fill and outline and so on ) Focus on naming to this components too. 2- Design Home screen to clothing contains: search, ads bar, categories and products Cards. Design product details screen. Design cart screen.

1- Do Competitive Analysis to 3 competitors in any field you choose and Swot Analysis. 2- The designs you designed in the previous task, design them here but used website frame and make the web responsive.

1- Summarize Chapters 1 & 2 and tell us what you learned. 2- Complete any screens not designed yet in clothing app and web like Check Out screens and account screens and anything else to complete this app.

Do a persona and empathy map to any idea.

Do a design system to clothing product.

What is customer Journey Map?

1- Summarize Chapters 3 & 4 and tell us what you learned. 2- Design a landing page to encourage people to download clothing app ( responsive ).

Details: 1. Choose a product or service you use frequently, such as a mobile app, website, or even a physical device. 2. Identify a specific problem that users face with this product or service. Try to be as precise as possible. 3. Write a Problem Statement that describes the issue. Make sure to include: - Who are the users? - What is the problem they are facing? - Why does this problem negatively impact their experience? Example: "Students attending lectures via the Zoom app are struggling to stay focused due to the lack of interactive features. This issue affects their learning experience and reduces the effectiveness of the lectures."

1- Summarize Chapters 5 & 6 and tell us what you learned. 2- Create a dashboard to clothing product.

1. Brainstorming: - Conduct an individual brainstorming session. - Choose a specific problem or topic related to user experience in a product or service. - Write down all the ideas and suggestions that come to mind for solving the problem or improving the experience, without evaluating or criticizing them. - Focus on generating as many ideas as possible within a set time frame (e.g., 15-20 minutes). 2. Affinity Diagrams: - After brainstorming, start grouping similar ideas together. - For each group, give it a title that represents the common idea. - Continue organizing the ideas until you have a clear diagram that shows the relationships between different ideas.

1- Summarize Chapters 7 & 8 and tell us what you learned. 2- Complete the dashboard and make it responsive.

1. Information Architecture: - Choose an existing website or app that you use frequently. - Analyze its current structure by mapping out its main sections and sub-sections. - Based on your analysis, propose a revised Information Architecture that improves navigation and user experience. You can create a sitemap to visualize the new structure. - Justify your decisions by explaining how the new structure better meets the needs of the users. 2. User Flow: - Select a specific task or goal a user would want to accomplish on the chosen website or app (e.g., purchasing a product, signing up for a service). - Create a User Flow diagram that shows the steps a user would take to complete this task, starting from the entry point to the final action. - Identify any potential pain points or areas of friction in the current flow, and suggest improvements to make the process smoother and more intuitive.

1. Usability Testing: - Select a digital product (website or app) that you or your group has worked on or are familiar with. - Create a usability test plan that outlines: the goals of the test, the tasks you want users to perform, and the criteria for selecting participants. - Conduct the usability test with at least 3-5 users. Observe their interactions, take notes on their feedback, and record any challenges they face. 2. Analysis: - After the testing, analyze the data collected. - Identify common pain points, user frustrations, and areas for improvement. - Summarize your findings in a report, highlighting key insights and specific recommendations for design improvements. 3. Iteration: - Based on your analysis, create an iterative plan that outlines the changes you will make. - Update the design or prototype to address the identified issues. - Consider conducting another round of usability testing with the revised design to evaluate the effectiveness of your changes.

1. Research: Brainstorming with the team • User Interviews with 3-5 users • Surveys for quantitative data • Affinity Diagrams • Competitive Analysis & SWOT Analysis of 2-3 competitors. 2. Personas & User Journey: Create 2-3 user personas • Create a user journey map highlighting pain points and opportunities. 3. Information Architecture & Wireframes: Design the structure of core pages • Develop low-fidelity wireframes for key screens. 4. UI Design & Prototype: Design the user interface applying best practices in layout, colors, typography, and spacing • Create a prototype using UI screens. 5. Usability Test & Iteration: Test with 3-5 users • Analyze findings • Update the design • Revise the prototype based on feedback. 6. Presentation: Each group should prepare a full presentation explaining the entire process, from research to final design, focusing on the solutions they implemented.