Final Project – High Fidelity app design

 08/07/2024 - 05/08/2024 / Week 12 - Week 15
DAVIES ANNIKA ANGELA  / 0362108
Application Design I/ Bachelor of Design (Hons) in Creative Media / Taylor's University
Task 4: High Fidelity App Design Prototype

---

Content

• Lectures
• Instructions
• Task 3: Low fidelity app design
• Feedback
• Reflection

---

LECTURES 

Week 12-14 - consultation

---

INSTRUCTIONS

TASK 4: HIGH FIDELITY APP DESIGN

For this task students will

Integrate visual assets.

Refine the prototype into a complete, functional product experience.

Focus on a selected task.

Create a high fidelity prototype of the app design

PROCESS

For my high fidelity prototype I copied and pasted my low fidelity prototype into a new design file and then started adding my assets into the design. I wanted the app to look more lively and user friendly by adding a colour background .

Figure 1.1 adding illustrations into the low fidelity prototype

I wanted to incorporate fun illustrations to make the app more visually appealing and easy to navigate especially since the app is used by people from all over the world and the best way to communicate universally is through visual design where everyone can easily comprehend and recognise comprehend and recognize the information and icons presented.

I was figuring out which colours best worked for the app design and also noticed that the icons had too many colours which were clashing with the design so I decided to make them all monochromatic and have the background be a gradient background to maintain the visual apeal. I found that having more illustrations makes it easier to digest the information they are given compared to the previous app design.

Figure 1.3 making illustrations monochromatic

 

Figure 1.4 current emgs home screen vs my prototype

There is also a live chat on the home page for users to easily seek support from EMGs in regard to any issues on their visa process.

Figure 1.5 current emgs app design vs my prototype

The home page is less cluttered and easier on the eyes and users were able to easily find different sections easier and track their application status.

Figure 1.6  current media emgs app design vs my prototype

 

Figure 1.7  current digital ID emgs app design vs my prototype

\

Figure 1.8 Making my own icons in illustrator

Figure 1.9 Linking for high fidelity prototype

FINAL HIGH FIDELITY PROTOTYPE

FIGMA LINK: click here

WALK THROUGH FOR HIGH FIDELITY

---

FEEDBACK 

I just worked on refining my protoype at this time. I got feedback from seniors to change the layout of the post-arrival check in.

---

REFLECTIONS

Experience 

I actually enjoyed doing this part of the module and seeing the app coming to life. There was al lot of trial and error as well as looking for inspiration on places like behance and dribble. In future I would like to add more interactive elements to my design to make it more intuitive. I 

Observations 

I observed that sometimes the design will change slightly and sometimes its good to take breaks from looking at the design to make better refinements.

Findings 

I found that there is so much about Figma I do not know about and I am excited to learn more tips and tricks to create interesting yet user friendly app designs. I am excited to redeem myself in Application design 11 next semester as this semester I felt like I could've done better.

---