Advanced Interactive Design / Task 1: Thematic Interactive Website Proposal
25.4.2024 - 19.5.2023 (Week 1 - Week 4)
Sheryl Pang Pui San / 0349746
Advanced
Interactive Design / Bachelor of Design (HONS) in Creative Media
Task 1:
Thematic Interactive Website Proposal
INSTRUCTIONS
Task 1: Thematic Interactive Website Proposal
For Task 1, we were to propose an idea for our thematic interactive website. I want to create a website about the fascinating process of Whale Fall. I started with a brief research about Whale Fall to learn more about it.
Research Document of Whale Fall Interactive Website
After doing the research, I look for references and build a moodboard on
Pinterest.
|
| Figure 1.1 Moodboard on Pinterest |
I determined my website content and animation opportunities after looking for
references.
User Flow Chart
 |
| Figure 1.2 User Flow Chart |
Wireframe:
 |
| Figure 1.3 Rough Wireframe |
Wireframe with text and mock images:
Prototype Link:
Presentation video
Feedback
Idea Propose
-
Think of the narrative/storyline to lead users to navigate and stay
on the website
Can use AI image/video for the design of the website
Proposal Draft
-
- Focus on the stages part
- Remember to write brief info abt whale
fall and include its importance and conservations inside
- Can try
doing timeline flow animation to make it more interesting
- Do click
scroll animation instead of auto scroll (coz for animation it wont look
nice)
- Click on text then only transition to the particular stage
page
- Can reference the book release website (how it transits from
one to another) and adopt from it maybe from up to down instead of left to
right
Notes: Landing Page vs Home Page
Both is the first page
user sees, landing page focus on promoting certain “purpose” with cta
button promoting something and home page is with all the nomal info
nothing specific
- Flow of chart remove the “marine biodiversity
& conservation” then its ok, its showing the flow right now but for
task 2 we will expand it…
- Loading page 1 & 2 sample ok
-
Proceed with wireframe & prototype (depends on how you visualize the
type of animation and interactions
- Do find layouts and reference
for interactive user experiences.
Think of the narrative/storyline to lead users to navigate and stay on the website
Comments
Post a Comment