Miguel Name's profile

UX/UI Challenge 2023

Design Challenge 2023
This challenge briefing works to organize the goals of each step, how this task will be carried out, and define the deliverables and what is expected as a result.
Status: Research, Insights, Design
High fidelity prototype made in Figma
First things first
Think | Understanding the problem
Context: The company Trevo Digital works with diverse clients globally in more than 15 countries, one of the main characteristics of the company is its strong position in the digital sector with a team focused on generating quality leads. Therefore, all projects must be very well structured thinking about SEO, fluidity, and reuse (components reused in different projects).
1) Who am I designing for?
New Trevo Digital customer.

2) What am I designing?
DASHBOARD. Visual panel with information, metrics and indicators for a Trevo client company. The Dashboard will display the indicators in an objective and clear way to support decision-making, track performance, and facilitate data monitoring.

3) What is the user´s needs?
a) Well-structured projects thinking about SEO, fluidity, and reuse (components reused);
b) Elaboration of an initial structure of the Design System and development of desktop and mobile prototypes of the Dashboard project screens for this new Trevo Digital client;
c) Tablet prototype as a differential;
d) The Design System for the project will be an initial draft with:
Font types;

Note: these are not clickable prototypes (screens designed with pre-programmed actions based on pre-defined scenarios) but Dashboard design, screens.

4) What are the technical constraints?
No technical constraints were reported.
5) Why am I doing this research?
To make discoveries, find insights and meaning by understanding a little beyond context, initiate wireframes and prototyping based on design patterns, and build and refine the design.
Question | Exploring the ideas
1) What is the most effective way to solve the user's need?
Redo what is necessary based on the existing material and research of Dash patterns. I understand Trevor's requirements as user needs and also as a starting point, as well as the provided desktop wireframe and color palette. See below what was provided.
2) Is there anyone who already solves this problem?
In the Figma community, there are Dashboard designs for many different purposes. Here below are some:
Deliver | Closing the loop
1) Why did I make my design decisions?
Referenced on material from the requirements and analysis team that developed the initial wireframe for the desktop version of the project and submitted the colors palette.
It was necessary to review whether the UI and UX were adequate/consistent/satisfactory before working on the prototype. With my knowledge, I did a proposal review and applied the corrections that I considered necessary to improve the project´s usability.

2) How does this solution solve the needs?
Based on the research Dashs, I applied the 8-point grid as a starting point for all formats and made the necessary adjustments for desktop with a breakpoint of 1440px, mobile of 428px, and tablet of 834px.

3) What can we iterate on in the future?
All points can be iterated with data generated from user behavior analysis prioritizing information. The A/B tests and heat maps can be used to understand behaviors.
1) How the results will be delivered?
Notion annotations, and Figma wireframes and prototypes.

2) What is expected as a result?
Wireframes and Dashboard prototypes for desktop, mobile, and tablet improved from Trevo team files, using the best design techniques such as colors, grids, SEO, and reusable components to deliver better usability and user experience.
8-point grid system
Desktop version (1440px)
Mid fidelity prototype
High fidelity prototype
Mobile version (428px)
Wireframe, mid and high fidelity prototype
Thank you!
Did you like it? I love new connections! :D
Linkedin: https://www.linkedin.com/in/miguelname
Whatsapp: +55 47 99654-8366
UX/UI Challenge 2023


UX/UI Challenge 2023