Advanced Interactive Design - Task 2

24 April 2024 - 29 May 2024 / Week 6 - Week 9
Sim Jia Min 0349784
Advanced Interactive Design / Bachelor of Design (Hons) in Creative Media / Taylor's University
Task 2: Website Prototype

INSTRUCTIONS (MIB)

Task 2: Website Prototype

Website concept: The website is based on a conceptual brand "Hawsome", created by myself, it is a website that briefly introduces the brand story, brand mascot and products of the brand, the goal is to showcase the youthful and energetic brand personality of it.

Figure 1.1: Prototype WIP

Figure 1.2: Prototype WIP
The initial design of prototype was a bit lack of colours and looked bland, which didn't suit the direction I was planning in the task 1 proposal.

Figure 1.3: Prototype WIP
I then tried to make some amendments by adding more colours and graphic elements. 

Figure 1.4: Prototype animation sample
As I had never really learned how to use Figma prototype to build animation before, I struggled a bit on this. Plus the concept of my website is horizontal scrolling, so I faced the problem of not understanding how to apply animation on one long horizontal frame, but only able to do the first frame. I have tried to look up online tutorial videos but none of it really cover the issue I was having.


FINAL SUBMISSION

Figure 1.5: Prototype animation sample

Figure 1.6: Prototype horizontal scrolling

REFLECTION

Throughout this project, I faced significant challenges due to my inexperience with Figma's prototype features. My website's horizontal scrolling concept made it even harder. While I managed to animate the first frame, I struggled to apply animation to the entire horizontal layout. I looked up online tutorials but couldn't find any that addressed my specific issue. Despite all the challenges, the process was definitely a learning experience of getting used to the basic feature of Figma.

Comments

Post a Comment

Popular posts from this blog

Advanced Typography - Task 2

Image
5 May 2023 - 9 June 2023 / Week 5 - Week 10 Sim Jia Min 0349784 Advanced Typography / Bachelor of Design (Hons) in Creative Media / Taylor's University Task 2A: Key Artwork, Task 2B: Collateral LECTURES Lectures are done in Task 1 INSTRUCTIONS (MIB) Task 2A: Key Artwork Instruction: - create a key artwork that represents personal identity, using initials, first name or nickname - explore and compose some artwork ideas with a few letters in your name (min 3 letters) - use elements that can represent you the most (personalities, interests, visions, etc.), and choose the best one for your personal branding - the artwork will be subsequently used in task 2B: collateral - artwork size: 1024 x 1024 Ideas:  I plan to use my initials "JM" or my first name "Jia" as my key artwork. As the key artwork is to represent my personal identity, I decided to put my personality into the artwork. I sometimes doubt my self-aware of my own personality, so I also asked my friends for
Read more

Advanced Typography - Task 1

Image
5 April 2023 - 5 May 2023 / Week 1 - Week 5 Sim Jia Min 0349784 Advanced Typography / Bachelor of Design (Hons) in Creative Media / Taylor's University Task 1: Exercise 1 - Typographic Systems, Exercise 2 - Type & Play LECTURES AdTypo_1_Typographic Systems Typographic systems - axial - radial - dilational - random - grid - modular - transitional - bilateral typographical organization: elements are dependent on communication for functioning, other criteria such as hierarchy, order of reading, legibility & contrast. use the system for handling complex information 1. Axial system: information divided into groups on a single line, placed at different angles or sides, could be straight lines or bend.  2. Radial system: elements are extended from a focal point.  3. Dilatational system: elements expand from a central point in a circle.  Exp of how the reading order works: Multiple rings of circles with information on either side or placed in hierarchical system where the most i
Read more

Advanced Typography - Task 3

Image
9 June 2023 - 7 July 2023 / Week 10 - Week 14 Sim Jia Min 0349784 Advanced Typography / Bachelor of Design (Hons) in Creative Media / Taylor's University Task 3:  Type Exploration and Application LECTURES Lectures are done in  Task 1 INSTR UCTIONS (MIB) Task 3: Type Exploration and Application Instruction: - Create font: area of interest/specialisation/personalisation/refinement of existing font/experimental material - Propose at least 3 ideas - All capital & small letters, and punctuation - Upload to Fontlab, adjust kerning - Provide application of how the font can be presented, relate to the core idea and purpose of the font Figure 1.1: Idea Proposal (Week  9, 31/5/23) Final Decision: Idea 1 Figure 1.2: Typography in magazine cover title/headline (Week 9, 31/5/23) As I think that this idea is relevant to my specialisation next semester, which is also the field of my interest, so I decided to develop this idea. Figure 1.3: "FILM" magazine for typeface expansion ( sou
Read more