Application Design 2 - Task 2: Interaction Design Proposal and Planning

22/05/2025 - 07/06/2025  / Week 5 - Week 7

Velicia Raquel Dewi Setiawan | 0369188 | Bachelor of Design (Honours) in Creative Media

Application Design 2 

JUMPLINK:

  1. Lecture
  2. Instruction
  3. Task 2: Interaction Design Proposal and Planning
    • Topic
    • Progress
    • Final Submission
  4. Feedback
  5. Reflection

1. LECTURE


2. INSTRUCTION


3. TASK 2: INTERACTION DESIGN PROPOSAL AND PLANNING

Description
Students are required to develop a comprehensive interaction design plan for their final web-based mobile application, including detailed wireframes, user flow diagrams, and prototypes of both micro and macro animations. The goal is to visually and conceptually prepare the interaction design and animations that will enhance the user experience of their application.

Requirements
1. Interaction Design Documents: 
Create detailed flowcharts and wireframes that map out the user journey and key interaction points within the application. These documents should clearly illustrate the layout of each screen and the navigation structure of the app.

2. Animation Prototyping:
  • Micro Animations: Prototype small-scale animations thatenhance the user's interaction with the application. These might include button effects, hover animations, loading indicators, and feedback messages. Use tools like Figma to create simple animations that demonstrate the intended effects.
  • Macro Animations: Develop concepts for larger-scale animations that significantly affect the user interface, such as transitions between different app states or animated introductions. For complex animations, you may use Adobe After Effects or similar tools to create more detailed prototypes. If actual animation creation is not feasible, you may alternatively provide references to existing animations that closely represent your intended design.
3. Visual and Written Explanation: 
Accompany your prototypes with a written explanation or a visual presentation that describes how these animations and interactions contribute to the usability and aesthetic of the application. Discuss the purpose behind each animated element and how it integrates into the overall user experience design.

4. Video or Class Presentation:
To be decided by the module coordinator. Refer to example past students’ blogs for more details.

Submission
1. App Project Files & Walkthrough Video
2. Blog post to put together the visual and written explanation. Imagine you are presenting your ideas and showing how it looks like.
3. Video Presentation if It’s not a class presentation (to be decided by the module coordinator)


1. Topic

For the topic, my group made a couple of topic suggestions on what we wanted to make, and after a while, we decided on mooncakes as the topic. Then our leader created a PPT to showcase during class.

2. Progress

Appdess 2 Flow Mapping and Storyboard – FigJam





3. Final Submission















4. Feedback

Week 4: 

Specific Feedback:

  • Make the information simpler.

5. Reflection

1. Experience 


2. Observation


3. Findings





Comments

Popular posts from this blog

Information Design - Exercise 1&2

Advanced Interactive Design - Final Project

Advanced Interactive Design - Task 2