DermLAB
Project Overview
In Semester 2 of 2022, I took Principles of Animation (DECO1017) as part of my Interaction Design Degree. This course was centered around the twelve fundamental principles of animation, exploring their application in UI/UX design as well as for the production of short animated films.
Structure
Individual task beginning from ideation to execution
Timeframe
September - November 2023 (2 months)
Technology
Adobe XD / Procreate / After Effects / Canva
User Research
Objectives: How to create greater user experience for health services.
Methods: In using focus groups, discussion amongst other young women and men was conducted surrounding how we access personal skin care and satisfaction rates in the methods we go to obtain such products.
Conclusion: The availability of user-friendly healthcare apps, particularly from skincare brands that offer customisation and health advice through a convenient approach, is notably scarce. This scarcity underscores the demand for applications with superior UI/UX design within the health industry.
Concept
Personalised skincare wellness informed by professional medical guidance.
Sketching
I sketched a series of mind maps to brainstorm the central idea surrounding my wireframe prototype and planning of all 5 distinct sections. This included sketches of flow charts capturing my thought process from selecting aesthetic qualities such as colour palette to the use of the basic principles animation in which best suited my wireframe prototype. I have also included original rough sketches which allowed me to quickly visualise how I was envisioning the design and functional navigation within the main sections.
Wireframing
Through animating wireframe designs in Adobe XD's prototype mode, I aimed to effectively utilise the basic principles of animation to provide users with the expected responsiveness from the app elements. I aimed to create an intuitive interface and create a logical heirachy of elements through using a variety of effects and easing to create purposeful transformations both automatically and controlled by the user. I aimed to incorporate aspects of gamification to create more exciting visual feedback, however, without overshadowing the app's function itself.
User testing
In conversation with interdisciplinary peers, I was able to conduct interviews, I further aimed to research and observe recent trends of in app UI/UX design fields and common occurences which seem to work. My wireframes aimed to encapsulate the theory of Design Thinking by taking into account the user research I have conducted. In using all the tools such as layers, components, paths, drop shadow and blur effects to create logical elements, I have aimed to give clear control to the user through prompting action. Aside from using tools in Adobe XD to create simple shapes and lines, I created more complex original icons with Procreate on the apple iPad along with the Apple pen. providing users with simpler navigation thus, greater user flow.
Branding Guidelines
In conversation with interdisciplinary peers, I was able to conduct interviews, I further aimed to research and observe recent trends of in app UI/UX design fields and common occurences which seem to work. My wireframes aimed to encapsulate the theory of Design Thinking by taking into account the user research I have conducted. In using all the tools such as layers
Final Prototype
Some of the principles I showcased were anticipation, squash and stretch and secondary action. This project was created with Adobe XD and further refined Adobe After Effects.