Interactive Design Final Compilation

Shim Yi Xun || 0363292

Bachelor of Design (Honours) in Creative Media
  Interactive Design GCD 60904  

Interactive Design Final Compilation

---

  Task Links  

> EXERCISES

> PROJECT 1

> PROJECT 2

> FINAL PROJECT

  Task Final Outcomes Jumplink  

> EXERCISE 01

> EXERCISE 02

> EXERCISE 03

> PROJECT 1

> PROJECT 2

> FINAL PROJECT

---

  Exercise 01  

Website #1
https://salonia.jp/limited/spring2023cam/

Design & Layout:
They are themed in illustration style and designed in a vibrant tone. The use of bold and bright colours adds to the overall visual impact of the content. Additionally, the typography is thoughtfully organised with a clear hierarchy. They focus their entire content in the centre column not only for the balance between the visual elements and content but also to keep it for the mobile device.

Content:
The content is organized and conveys the information clearly. Apparently, their main target consumers are Nijisanji fans as they put the limited edition giveaway first in order to catch those fans’ attention. After then are the product details and contact information.

Functionality & Usability:

It does not get any navigation bar, just scroll down till the end. But the other buttons are functioning well. Besides, the interactive elements are not too much since the website aimed to be designed for mobile devices. Thus the interactive part is only located in the character display, and product details will be displayed when clicked.

Performance:

Loading time won't take too long since they are entirely 2D elements. And the responsiveness is smooth too on pc and mobile devices.

Website #2

https://brewdistrict24.com/nl

Design:

The site comes in four colour tones that can be switched and changed for each exclusive. In addition to this, the can in the middle appears to fall while scrolling down the page, adding fun to the site without feeling bored.

Layout:

The typographic hierarchy is well organised on the other pages. But in this page, the font looks small and difficult to read. The information organised is scattered, which can confuse the viewer as where to read.

Purpose:

Its purpose have expressed clearly and effectively that this is a craft alcoholic drink.

Content:

The content is clear and acurate.

Functionality & Usability:

The navigation and the buttons are functioning well and completed. There is not only the interaction of switching colours, it also got a mini-game to interact with, you can click on the can to gain score and up level... that's it.

Performance:

Loading may take some time. Furthermore, the response speed is quite efficient and smooth.

  Exercise 02  

  Exercise 03  

Link to view for the website:

https://shimcookierecipe.netlify.app/

  Project 1  

  Project 2  

Link to view for the website:

https://yishim-resume.netlify.app/

  Final Project  

Link to view for the website:

https://kamisato-ayato-wiki.netlify.app/

---

 Reflection  

During the course of these projects, I delved into various aspects of interaction and web design. Starting with Task 1, I learned to use Figma for prototyping, which initially seemed daunting but became intuitive with practice. Continuing with Project 1, I focused on creating a functional and visually appealing prototype for a digital resume, honing my skills in layout design and user interface aesthetics.

In Project 2, I used my prototyping knowledge to build a working web page. This project deepened my understanding of web structure and responsiveness, emphasizing the importance of user experience in design. Finally, the final project involved creating a single-page application in which I integrated all the skills learned throughout the course. The project emphasizes the importance of coherent design and smooth functionality to ensure a seamless user experience.

Throughout these projects, I gained valuable insights into the iterative design process, the importance of user feedback, and the need to balance aesthetics with usability. These experiences have greatly enhanced my design abilities and prepared me for future challenges in the field of interaction design.