In this video I will build the primary user interface layout and components of the personal budget application that I am building as a side project myself. The design and wireframes are done in Figma, where I have prepared a set of simple components (buttons, tables, form elements, typography and colors. During the video I walk you through the layout I have chosen for the application and explain the reasons behind my choices. After that I use the components to populate the low-fidelity wireframes in order to have a complete UI design of the main view of the application. Along the way I mention multiple challenges in detail.
Contents:
0:00 Introduction
0:26 Notes on the Design Software
1:07 Components Library
8:25 Layout Wireframes
20:47 Budget Tables
31:28 New Transaction Button
32:10 Month Switch
37:46 Background Colors
39:20 Month Switch Calendar Icon
41:27 Remarks on the Completed Budget Section
43:15 Sidebar Navigation
47:51 Summary Statistic Cards
1:16:16 Spendings per Category Pie Chart
1:26:22 Transactions Table
1:40:00 Final Adjustments
1:42:15 Conclusion
Social Media:
Email: [email protected]
Twitter: / nikelaz
LinkedIn: / nikola-lazarov
#project #application #design
Смотрите видео UI/UX Design 👨💻 Develop an App from Scratch (Part 2) онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь NL Tech 11 Февраль 2024, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 1,148 раз и оно понравилось 22 людям.