Advanced Interactive Design | Task 2 : Interaction Design Planning and Prototype

24/09/2024 - 15/10/2024 (Week 5 - Week 8)
Yong Xiao Tong / 0368290
Advanced Interactive Design / Bachelor of Design (Honours) in Creative Media 
Task 2: Interaction Design Planning and Prototype

Instructions

Task 2 : Interaction Design Planning and Prototype

We are required to work on our visual design and plan our website’s interactive design elements and features.

Design Concept
According to the official introduction, the Longines Spirit Flyback watches were designed to honour the brand's pioneering spirit and historical connection to aviation and exploration.

Inspired by this legacy, I aim to create a website design that incorporates themes of adventure and precision, reflecting both the watch’s heritage and its modern innovation.

To reflect the spirit of exploration, I plan to use a sky-inspired colour palette with shades of white and blue. 

Additionally, as this is a luxury brand, the design will feature clean layouts with ample space to enhance elegance.

Background

Interactive Elements
The circular motifs were designed by me, inspired by the watch’s elements. If you look closely, these simple geometric shapes reflect the essence of the timepiece.

Fonts
The fonts I’ve chosen are Bodoni for headings and Futura for subheadings and body text.

Prototype

Flow Chart


Final Submission
Longines Spirit Flyback 

Presentation







REFLECTION

In this task, my focus shifted from research and conceptualization to designing and prototyping the interactive elements of the website.

The planning process began with defining my theme colors, which helped establish the design direction. Drawing inspiration from the brand’s aviation heritage, I decided to use a sky-inspired color palette of white and blue as the theme.

The interactive elements were a critical aspect of this task. I incorporated smooth animations inspired by the precision and craftsmanship of the Longines Spirit Flyback watch.

Overall, task 2 was a valuable learning experience. It strengthened my ability to design user interactions, create smooth and visually appealing animations, and ensure consistency across all pages. Moving forward, I feel more confident in my ability to bring the final prototype to life.


Comments

Post a Comment

Popular posts from this blog

Game Development | Task 2 : Art Asset Development

Image
22/05/2025 - 08/06/2025 (Week 5 - Week 7) Yong Xiao Tong / 0368290 Game Development / Bachelor of Design (Honours) in Creative Media  Task 2: Art Asset Development In this task, we need to create the art assets for our game.  This includes designing characters, environments, items, props, obstacles, power-ups, and the HUD. Characters Our game features 4 characters: 1 protagonist and 3 unique enemies. Aura (Protagonist) idle walking jump boost Human patrol (Enemy) human patrol Dog (Enemy) idle attack Owl (Enemy) idle attack NPC Firefly firefly Effect boosting UI Elements buttons Props & Obstacles home grass direction signboard box ladder moon spike Backgrounds & Tileset For our game, we designed four unique levels, each with its own distinct background to reflect the environment and mood of the stage.  Background design process in Adobe Illustrator The backgrounds are as follows: BG#1: City street scene, filled with urban elements and modern structure...
Read more

Experiential Design | Final Project

Image
18/11/2024 - 5/01/2025 (Week 9 - Week 15) Yong Xiao Tong / 0368290 Experiential Design / Bachelor of Design (Honours) in Creative Media  Final Project Project Idea: RoomEats AR App As I continue working on my project, I've made several small refinements to improve the functionality and layout. All of these refinements are aimed at enhancing the overall user experience. Initially, I had planned to incorporate both marker-based and marker-less AR functionalities. The marker-based approach would trigger the image target to unlock the menu panel, while the marker-less functionality would scan a flat surface to display the 3D food. However, Lecturer Razif recommended focusing on marker-based AR for a more seamless virtual environment, so I decided to streamline the project and stick with the marker-based approach. This decision also makes the project less complex and more manageable. As a result, I've adjusted my plan so that the image target now serves tw...
Read more