APPLICATION DESIGN - FINAL TASK: MICRO INTERACTION PROTOTYPE
Application Design 2
Task 3
Micro Interactions and Animated Micro Interaction Prototype
Exercises
Task 1: Self-Evaluation and Reflection
Task 2: Hybrid Lo-Fidelity Mobile App Development
Task 3: Micro Interactions and Animated Micro Interaction Prototype
INSTRUCTION
Honestly after knowing that I have to code everything, I felt quite devastated. I suck at coding so much and I didn't know how I was going to finish this. However, I tried to do it slowly and thanks to my friend's help, I was able to finish it.
I changed most of the animation just because it was so hard to do. Most of the animation became pretty simple and as long as it is interactive, I'm satisfied already.
Here is how the splash screen and the onboarding animation look like after I moved it to HTML, CSS, and javascript:
Honestly, it probably doesn't look as smooth, but I think it looks pretty okay.
For the making task, I simplified the steps. However, it still shows the end result of how it will look on the front page after you create the task:
For the event, it is pretty much the same.
You may see the complete version here: https://64b55041665a3911b5ffb406--elisi-planner-app.netlify.app/
You may also see the Figma here:
REFLECTION
Honestly, I know that I am a UIUX student, but I don't really enjoy the coding part at all. It was so boring and stressful. Thankfully my friend helped me a lot throughout this task. It frustrated me also that I wasn't able to make the design and animation as accurate since my coding skill isn't that good. However, I'm glad that I have finished everything and I hope I at least did a decent job. Especially because I'm pretty proud of the design. Just not with the coding.
This module made me realize that this is what I will mostly face in my work life in the future. It encourages me to learn about coding deeper just so that I could become a competent UIUX designer.
1.jpeg)
Comments
Post a Comment