Interactive Design// Project 1//Landing Page Design

 

10/5-31/5/22 Week 8- Week 10

Chan Siew Ni #0352518
Bachelors of Design in Creative Media

Interactive Design//Project 1

---

INTRODUCTION

<iframe src="https://drive.google.com/file/d/19Jm8JmX_P6Zb26cpaeHRs6jTknT7wtKy/preview" width="640" height="480" allow="autoplay"></iframe>

---

LECTURES

Lecture notes will be in Interactive Design Exercise

---

PROJECT 1 

Task: Landing Page Design

A landing page is a distinct page on your website that's built for one single conversion objective. A landing page should be designed, written and developed with one business goal in mind. You are required to create a static landing page of a microsite from any topic of your choice. 

Sketch of wireframes

Figure 1: Approved wireframe(Week 9)

References / Mood board

Figure 1.1 : Color palette references sources from Pinterest

Figure 1.2: Landing page design sources from Pinterest

Figure 1.3: Landing page design sources from Pinterest

Digitized (Illustrator)

Based on the wireframe, I created a 1980x1080 artboard and start making my landing page design. 

Figure 1.4: Work progress on making landing page design

Figure 1.5 : Work progress on making landing page design

Week 10: 

After I showing my landing page design to Mr Shamsul on today's session, he asked me to change several parts (details on feedback). Then, I start changing it.

Figure 1.6: Comparison between before(left) and after(right)

Figure 1.7: work progress on amending landing page design

Figure 1.8 : final landing page design, 3/6/22

---

FEEDBACK

Week 9

Mr Shamsul said that wireframes should not be in colored and the layout is not acceptable too so he wants me to re-do it and show him later in the class. Then, at the end of the class, I showed him again my wireframe and he said I can proceed with it and start think about the mood board and developing in Illustrator.  

Week 10

Mr Shamsul said that my font size in navigation is too big, the picture can be put at a full size covered the part and text put at the negative space of the picture. Then, he said that I didn't manage my margin well and all the elements were close to the border. Then, some of the icon were too big and needs to be change. He also asked me to make my layout cleaner because now it seems very messy. The paws background can be remove.