Application Redesign
Ironhack Project4
Time is gold! If you are one of the people who do not like to waste their time and are always looking for solutions to manage your time, then continue reading this article.
Let’s begin^_^
In this project, we covered these points:-
- introduction
- The Problem
- The Solution
Low fidelity design
Style tile
Typography and color
High fidelity design
Prototype
- Conclusion
introduction:
For this project, we had to choose a specific application, analyze it, and identify problems with its user interface. Next, we had to redesign the interfaces to solve these problems. So I decided to use Calendar. Events, is an application with several features, including the ability to create an infinite number of tasks that are organized into different categories and colors.
The Problem:
1-Unfamiliar Icons: When you click on the green icon, it takes you to the next interface, which is the settings interface, but in most applications, the settings and more are represented by this icon (⚙) for settings and this icon for more icons (…)
This also holds true for the bottom navigation bar. the main interface icon should be a house icon (🏠), not a calendar(📅).
2-Crowded Archive: this interface seems really unorganized, crowded, and has an unhelpful design. It is an interface that saves all the tasks you added previously, but when you want to delete one of these tasks, you must click on them one by one to delete them. The goal of this interface is to save the user the time of adding the same tasks every time. All you have to do in this interface is click on reschedule to have them added to the main interface.
3-Buttons don’t work: the user is not sent to the calendar application or interface in this interface when they click the calendar button to add this task. Additionally, the user is led to believe that he can click on the arrows adjacent to the Repeat and the Same time, but in reality he cannot do that.
The Solution:
To solve the previous problems, we will redesign these interfaces, which means making changes or improvements to the existing design of something, like a website or an app. It’s like giving it a fresh new look and feel.
Low Fidelity Design: is a design approach that involves creating rough prototypes with minimal details, allowing for quick iteration and feedback, enabling designers to refine their concepts before investing more time in high fidelity designs.
Style Tile: are a design deliverable consisting of fonts, colors and interface elements that communicate the essence of a visual brand.
Typography and color: I used the same font type used in the application, which is a natural, humanist, Sens Serif font with dashes of the same width that give a unified appearance and is characterized by being neutral, modest, and practical. As for the colors, I used red to symbolize energy and green to represent optimism for the application’s elements, and I utilized black and white for the fonts. Gray serves as the application’s background color.
High Fidelity Design: refers to creating polished and refined prototypes that closely resemble the final product. It includes realistic visuals, accurate content, and interactive elements.
1-Archives Interfaces Solution: when clicking on the Archive option, the user will move to the next interface, which contains the previous tasks that he previously created. He can reschedule them, or by clicking on the Delete button at the bottom. He can select the tasks he wants to delete and then click on the Delete button, or he can undo that by clicking on the Cancel button of the last interface. Shows you the tasks after deletion.
2- Calendar and task interface Solution: when you click on the New Schedule option, the application will take you to the next interface, through which you can add a new task. Then it will take you to the next interface, which contains the calendar. At the bottom, you will find the tasks that you have added. You can also edit by clicking on the Edit button.
Prototype: is mockup used to test and validate design ideas before building the final product. They can be low or high fidelity and help gather feedback and iterate on designs.
Conclusion:
Redesigning apps enhances usability, user experience, and addresses user feedback. It incorporates new features, updates visual design, optimizes performance, and maintains competitiveness in the evolving app market.
what did I learn:
- When choosing a grid for design, I have to consider several factors such as content and hierarchy for consistency.
- Using the same colors, styles, and font sizes for design elements makes the design consistent and attractive to the user.
- To easily copy duplicate elements on app interfaces, create a parent component and duplicate it across the interfaces. Modify the parent component, allowing modifications to appear in child components in moments!
- I can create a library that contains all the colors of the design so that I can fill the elements easily, and this also applies to the effects as well.
- Redesign helps improve the user experience.
