There are some good design tool for UI/UX designers and each company has their own preference. I used Sketch when I was in Apple Developer Academy. However, I also wanted to master other tools or at least know their basics. I don’t want to be limited to just one tool.
Adobe XD is gaining traction and is a serious competitor to popular softwares like Sketch or Figma. With Adobe XD, we can design, prototype, and share. It is available on MacOS, Windows, and the mobile preview app is available on iOS as weel as Android. If you use other Adobe products, you will feel some familiarity. There are many exciting features, like interactive prototypes with flows, animation, voice prototyping, and gaming support, collaboration or sharing in a view-only mode, and many more. To be honest, Adobe XD is my favorite tool now. I find myself design quicker and better with it.
What is Adobe XD Daily Creative Challenge?
Each day for two weeks, we’ll receive a challenge with a particular theme. An expert hosts daily live show to introduce the challenge and give some inspirations and tips. After we finish the challenge, we can share our design on Behance or, even better, share it on Discord and ask for feedback from fellow designers and mentors. It is a great way to improve skills, get to know Adobe XD’s features or to dig deep anything related to Adobe XD. To find out more about Adobe XD Daily Creative Challenge, go to Behance.
Without further due, here is my take.
The Dashboard Page
What is it?
It is the web version of a sales recording-reporting and inventory management app or more commonly known as Point of Sales (POS) app. It is inspired by my own team’s project, JUALANMU. The dashboard/report page is where you can monitor your sales in details.
Who is it for? (The User)
Small and Medium Enterprises owners or people in charge of making strategic
decisions. They need data from the report to determine the direction of their business and make better strategies.
The Journey
Day 1 – Plugins
Create the navigation bar for a desktop dashboard and explor plugins to speed up
the design process.
Day 2 – Content-Aware Layout
Design a call-to-action header group for a desktop dashboard. Use Content-Aware Layout to easily resize and rearrange elements.
Day 3 – Repeat Grids
Use a Repeat Grid and Components to quickly build and customize the section.
In this case, the repeat grid is used for “Highlights” or “Sorotan” and “Overview” or “Ringkasan”
Day 4 – Component States
Design custom charts for a desktop dashboard. Use Component States to create various chart periods such as today, this week or this month.
Day 5 – Guides
Use guides to create alignment and consistency.
Day 6 – Anchor Links
Design a desktop dashboard that requires scrolling and add Anchor Links that serve as navigation aids.
Day 7 – Audio
Design an animated search field for a desktop dashboard and subtle sound effects using Audio Playback.
Day 8 – Masks
Create expandable information cards for a desktop dashboard. After designing the card previews, use masks to enlarge them with tap triggers.
Day 9 – Auto-Animate
Create an animated navigation bar using Auto-Animate and masking techniques.
Final Design
