Challenge:
Our team needed to find efficient and quick ways to design and develop digital products for our customers. Since our development team used Material Design principles for their development process, finding a quick way to match our designs with their resources was important. There are several free English UI kits availabe for Material design in Figma but there are no Persian UI kits availabe on the market. Apart from the need to translate phrases and typography issues, Persian language is a Right-To-Left language. To address these issues, making a scalable Persian language UI kit based on Material Design principles was an important project for our team.
Solution:
Design a Persian language UI kit based on Material Design principles using Atomic Design approach to maximize its scalibility
Outcome:
We designed the first version of a Persian language UI kit based on Material Design Principle usign Atomic Design approach. This version consists of the basic cruicial components needed in a UI kit. We plan on making this UI kit available for free in Figma community and also want to create the first open contribution Persian UI kit, allowing the community to improve the UI kit every day.
Role:
UI/UX Designer
Tools:
Figma
Design Tokens
Colors
Atoms
Molecules
Organisms
Developer hand-off optimization solutions
Figma is a great web-based tool for design and also offers many options for developer hand-offs but during this project we needed to find an optimal way to ensure synchronicity between our design and their code.
To showcase the "Folders" in their code and their routing, we had to get creative with naming the pages of our project due to the lack of a foldering feature in figma.
Figma Designs
you can view Toranj UI kit project in Toranj UI kit Link