MLO 2: Thematic Website Design Proposal

-

(WEEK 1-14)

LEBON STEPHANIE AMELIE JUDITH  0362853

Advanced Interactive Design/ Bachelor of Design (Honors) in Creative Media/ Taylors University

Instructions

Description

Thematic Interactive Website Proposal for Brand Engagement. A thematic interactive website is a website that focuses on a specific theme or concept with the aim of incorporating interactive elements to interact with users. Most such websites utilize multimedia such as videos, animations, interactive graphics displayed on the page, or other clickable elements which have interactive components that provoke the user. This dynamic experience is meant to keep the user interested in addition to the thematic concept. Themes in such websites vary from educational, cultural, promotional campaigns to product launch. For example, a thematic interactive site could be a museum. Users can go through a virtual exhibition space through interactive tours, games simulation, or questionnaires. In the event that it is a movie, the site can simulate movie universes offering virtual tours through time and space, or any other subject previously created in the movie. The aim of any such site is to keep the user engaged in the medium through interactive exploration.

Requirements

Students are required to create a thematic interactive website proposal with the topic of their choice that can be based on:

  • A specific product of a particular brand launch/special (i.e.: Nike brand new shoe), Beauty product launch (i.e.: Sephora compact powder)
  • Movie promotion
  • Game release promotion.
  • Gallery/Museum exhibit launch
  • Band/Artist latest release.
  • Or anything else you have in mind (subject to the module coordinator’s approval)

Submission

  1. Completed UI/UX proposal document.
  2. All processes (concept, wireframes, mood board, flow chart/site map)
  3. Prototype

 Completed UI/UX proposal document with process included.

Anti-poaching

Prototype:

Final website:

Week 10: The first step of the website was trying to reverse engineer the given week 7 activity to start understanding where to start.

Week 11 and 12: After studying the website I started making my first version from scratch where I focused on animations and interactivity



Week 13 to 14: I was pretty unhappy with the overall looks of the website and decided to go back to my figma prototype to start from scrach all over again

This time I went closer to the looks of the figma but still using the icon I made and changing the images to more on theme ones.

I struggled in making animations as the scenes where way to complex as I really wanted to add vertical scroll ability to the page as i have a lot of sections of information to show and the whole game page was really difficult to figure out so i used the help of Ai to help figure it out and execute it because of all of this I faced a major alignment and artboard issue where due to time i ended up eye balling many parts of the site.

The home page ended up being the simplest page to work on.

I spent a lot of time making sure as many elements as possible where interactive and at least had a hover feature.

The popups on this page were really hard to figure out and I unfortunately made them in a way where going back  adding the hover interactivity ended up being more difficult than intended.

This page was by far the hardest and most time consuming to the point where I had to settle for the prototype I made with the help of Ai in the end which had a time out issue and I was not able to customize my clickable icons..

For this page I had to reverse engineer and recreate existing chat boxes, these chat boxes created so many alignment issues.


Week 15 onwards: Due to lack of time my want for so much complexity ended up causing so many issues as the whole trouble shooting part of this assignment caused so many delays end even after submitting I still did not have enough time to fix the several issues I faced and had to settle for something a lot less polished as I wanted even using Ai to try help my troubleshoot the alignment issues, I made a home page naming issue, all the action codes I ended up using Ai to try correct the pressure of not enough time got to me, after writing this reflection and seeing how complicated my .fla file ended up being to thee point where I struggles to find where all the errors where I realized I should have went for simpler and more polished from the start.

Final Submission:


Netifly Link:

Comments

Post a Comment

Popular posts from this blog

DIS60304 Design Research Dissertation

-
  25.09.2025--4.1.2026 (WEEK 1-14) LEBON STEPHANIE AMELIE JUDITH  0362853 Design Research Dissertation / Bachelor of Design (Honors) in Creative Media/ Taylors University Final Compilation and Reflection: TABLE OF CONTENTS: Instructions. Task 1 Task 2  Task 3 Task 4 Feedback Reflection Instructions: Task 1: Task 2: Task 3: Task 4: Feed Back: Reflection: Throughout the completion of this research project and its associated tasks, I have gained a much deeper understanding of both the academic research process and the role of visual communication in education. Working on the dissertation, visual design, and journal article stages allowed me to experience the full lifecycle of a design research project, from initial investigation to refined academic output. At the beginning of the project, I found the research process challenging, particularly in structuring my ideas clearly and aligning them with academic standards. Developing the literature review required me to critically...
Read more

Intercultural Design

-
03.02.2026--17.03.2026 (WEEK 1-7) LEBON STEPHANIE AMELIE JUDITH  0362853 Intercultural Design / Bachelor of Design (Honors) in Creative Media/ Taylors University TABLE OF CONTENTS: Instructions Project 1 Project 2 Final Project Feedback Reflection Instructions: Project 1: Presentation Slides: Intercultural by Group 8 Presentation : https://drive.google.com/file/d/1Pi2DC6v5ZfDeHFl0pn11q2RgPJAT8hlD/view?usp=drive_link Project 2 Field Study by Group 8 Final Project: Final Project by Group 8 Presentation : https://drive.google.com/file/d/1o715lgA3Yae96Zpgbh9XlLJGJsdF2OZ9/view?usp=drive_link Feedback: Week 1: We formed Groups Week 2: We went to Mr Fauzi for feedback and he guided us on how to go on with our idea and suggested to move towards the theme of park reading. Week 3: Public Holiday Week 4: We went on our field study to Perdana Botanical gardens, took photos, made ideas, observed, experienced and got interviews Week 5:We went to Mr Fauzi to show him ou...
Read more

FINAL PROJECT: INFOGRAPHIC VIDEO ANIMATION

-
Image
TIME FRAME:  WEEK 10 - WEEK 13 DEADLINE:  WEEK 14 INSTRUCTION: Based on FLIP group topic research, produce a basic video animation. DESCRIPTION:  Using a processed design framework, you will now produce an infographic report to present the given information to a ‘target audience’ with the purpose of: 1. Creating awareness (such as Global Warming, Recycle, etc.) 2. Explaining a process (such as "how to" video) 3. Defining a concept (such as "What is Fast Fashion", "What is Color Wheel", etc.) Any time based media and software using photography, vector imagery. Design Considerations: ● Organization Principles – LATCH and Content Organization ● Aesthetic Principles – Animation principles ● Cognitive Principles – Principles of visualization Output Expectation: The presentation must be deliberated on, consider each assessment rubric of sorts to your final outcome: ● Show causality ● Multivariate graphics and visuals ● Integrate word number and images ● Content ...
Read more