Advanced Interactive Design -FINAL PROJRCT

- JUNE 19, 2025

25.06.2025 - 25.07.2025 / Week 9 - Week 14

GU QIANKUAN / 0369385
Advanced Interactive Design / Bachelor of Design (Hons) in Creative Media

TABLE OF CONTENTS

1. Lectures

2. Instructions 

3. Task 2: Interaction Design Planning and Prototype

4. Feedback

5. Reflection

2. INSTRUCTION 

2. FINAL PROJECT: INTERACTIVE WEBSITE

My selected topic GOD OF WAR: VALHALLA RISING (GAME PROMOTION)

Moodboard.

Visual References.

Further Concept Development

Colour Scheme

Wireframes

Prototype Overview 

Work Progress #1 in Adobe Animate.

Work Progress #2in Adobe Animate.、

Work Progress #3 in Adobe Animate.

Work Progress #4 in Adobe Animate.

Final Submission

Publish Website:https://guqiankuan0369385.netlify.app/
Folder: https://drive.google.com/drive/folders/1NuNbwE6WiAFfpzxqGvf27eABMjj_OKMk?usp=sharing

3. FEEDBACK

Week 11

We need to categorize and organize project files and folders in a reasonable manner to maintain good file structure management. For example, store JavaScript files, images, fonts, and other resources in separate folders to ensure that the project structure is clear and orderly, making it easier to maintain and manage.

Feedback supplement: Please change the website domain name to something like yourname-finalproject.netlify.app to ensure naming standards are followed.

Week 12

Responsive testing: Before the project is completed, the website should be thoroughly tested on different devices (mobile phones, tablets, computers) to ensure that its responsive design is effective, that the page layout adapts to different screens, and that the user experience is enhanced.

Week 13

Add Comments in Code: Include clear comments to explain the purpose of your code sections. This will help others (and future you) understand your work better.

---

4. REFLECTION

Experience

While completing this task, I tried combining web design with animation for the first time and experienced both the challenges and joys of the design process. Using Adobe Animate, I learned how to make page elements more vivid and enhance the overall visual effect. This process made me realize that the fusion of technology and creativity is the key to producing high-quality digital content.

Observation

I discovered that animation is not merely for aesthetic purposes but is crucial for enhancing the user experience. Well-designed animation timing and details can effectively guide user attention and improve interface usability. Through repeated experimentation with different animation parameters, I gradually mastered how to create smooth animations without compromising performance.

Findings

This practical experience taught me that interactive design must balance visual effects and user experience, neither of which can be overlooked. Adobe Animate provided me with flexible animation tools, enabling me to create dynamic effects that meet design requirements. Overall, this experience deepened my understanding of digital media design and improved my practical skills.