top of page
Upon receiving the project, I decided to make UX improvements to the home page.
In the design I received, the lighting tab contained a carousel of pictures displaying all the lights in the selected room. The tab was located among tabs filled with pictures and icons, creating a lot of visual noise and cognitive load.
Therefore, I placed a single image of the selected lamp in the center of the tab, along with arrows that allow navigation to other lamps in the room.
In the previous design, the battery status occupied a significant portion of the screen and was very prominent, even though the data in it changed slowly and was relatively less relevant to the user. Therefore, I relocated the battery status to the upper corner, where most regular users expect to find it, and in its new form, it displays all the information in a more compact manner.
In the previous design, the Favorites column was situated between two heavily populated tabs with different elements, causing cognitive overload and undermining its importance.
Therefore, I positioned the Favorites tab above the scenarios in a larger tab to emphasize its significance and enhance its accessibility to the user. This solution significantly reduced cognitive overload.
A project as part of the course at Codesigner
Responsibilities: UX | UI Design
Platform: Tablet & Mobile
Throughout the course, I was given two wireframes and tasked with creating a UI design based on them.
UX design
Assignment
The guiding principle is a clean and subtle design that supports the application's character.
I chose purple and turquoise as the main colors because purple is a regal color, and its darker shades symbolize intellect and dignity. Turquoise, on the other hand, is a color that conveys feelings of calmness and tranquility, associated with a sense of hominess and security.
These colors aligned with the overall visual direction.
Additionally, I opted for rounded icons with low detail and designed cards with rounded corners to soften the appearance of the application.
UI design
Light mode
UI design
Dark mode
The dark mode provides a smooth and comfortable user experience, as the details and functions take center stage for the user's attention.
I adjusted the application's colors to be more vibrant and radiant, so they can have the appropriate presence.
These color choices enhance the dynamic interface and provide a pleasant and gentle user experience.
UI design
Mobile version
I surveyed users to adapt the mobile app for smaller screens.
The survey determined key elements to include and emphasize.
Using the feedback, I prioritized frequently used features and effectively highlighted important elements within limited space.
The survey guided design decisions for a user-friendly mobile app.
Design Guide
Typography
poppins
Aa Bb Cc Dd Ee Ff Gg
1 2 3 4 5 6 7 8 9 0
Colors
Icons
#FFFFFF
#F0F0F0
#21B1B1
#9263C1
#5FCDC6
#2F2F2F
#1A1A1A
#B870FF
#21B1B1
#F0F0F0
#5FCDC6
#1A1A1A
#2F2F2F
#FFFFFF
#B870FF
#9263C1
Thank You!
bottom of page