INTERACTIVE DESIGN - PROJECT 1
Rausha Aminath (0337000)
Interactive Design
Project 1
LECTURES
Lecture 3:
18.04.2019 (Week3)
INSTRUCTIONS
WORK
Week 3
We started our project 1 by planing out our wire frame after choosing our topic of interest, during the class and showing it to Mr.Shamsul. I chose to make a website one of the albums of my favourite band, OneRepublic. After getting approval from him, we were to start building up our landing page in either photoshop or Illustrator. I started my work on illustrator after Mr.Shamsul approved my design.
I started off by looking at some existing samples of some musicians and also samples of landing pages I liked.
![]() |
James Arthur Official Page |
![]() |
Sam Smith Official Page |
![]() |
Landing Page References |
![]() |
Initial Design |
Week 4
After experimenting with blending background color, I saw that the background had a dirty look and so I decided to use a photo of the band instead of the album cover. The original album cover was too bright and did not match my color scheme and so I started redesigning and my design did not resemble the sketch I had previously done.
![]() |
One of the New Designs |
![]() |
Second New Design |
![]() |
After Refining |
I started working on fixing the layout once again. Played around and created different drafts till I found the best fit.
![]() |
Some of the Draft Layouts |
![]() |
Final Layout (Two Versions, White (left) Black (Right) |
![]() |
Process 1 |
![]() |
Process with drop down |
Final Design main page (left) and drop down menu (Right)
Final Outcome - Embedded Pdf
FEEDBACKS
Week 3:
Mr.Shamsul approved my idea of creating a website from an old album of One Republic. He approved my design sketch and suggested having the album art with a low opacity behind as a background for the landing page.
Mr.Shamsul approved my idea of creating a website from an old album of One Republic. He approved my design sketch and suggested having the album art with a low opacity behind as a background for the landing page.
Mr.Shamsul pointed out that I need to insert title for each page and also to leave more white space. I showed all my drafts and he preferred the draft with white background and he gave small details to change. He said to minimize the use of photos that had texts in it and try writing a summary in the page itself.
REFLECTIONS
EXPERIENCE
Week 3:
During this weeks class I was pretty clam and felt like I was sure of what exactly I wanted and this was not common for me so I was excited to start my project 1 right away in the class. I did not want to waste time as my motivation was at peak. It was a pretty productive class.
OBSERVATIONS
Week 3:
I noticed that most of my classmates were taking a lot of time trying to determine their topic for the landing page. I also observed that many existing websites for the topic I chose had a very similar layout.
FINDINGS
Week 3:
I realized that choosing a topic that I found very interested in makes me want to work harder and made me excited for the final outcome. This is so far one of my favorite projects this semester. I found myself being very productive in class and wasting less time procrastinating.
FURTHER READINGS
Week 3
The 12 Do's and Don'ts of Web Design
Don'ts of Web Design
When designing websites, making your design useful and enjoyable is your top priority, which could be overwhelming for a new beginner. There are Do's and Don'ts for web designing.
Don'ts include, not making users wait for content to load. Avoid blank pages during loading.
Don't open internal link into new tabs.
Don't use too many types faces.
Don't use too many colors in your website.
Don't show automatic pop-ups too early, such as request to subscribe.
Don't use generic photos of people. Many corporate stated are over-using insincere photography, rarely adding to the design and harm the user experience
Don't let promotion steal the show. It is important to acknowledge that anything that looks like an advertisement is usually ignored by users - the phenomenon knows and banner blindness.
Don't play background music or autoplay videos with music. While it works in specific areas it is simply a bad idea for most. Put users in control. Set music to default by allowing them to turn on if they click.
Don't hijack scrolling. Designers manipulate scrollbar to behave differently on their website, which takes control away from them making it annoying for most users.
Don't hijack scrolling. Designers manipulate scrollbar to behave differently on their website, which takes control away from them making it annoying for most users.
Don't use horizontal scrolling. Users usually have no idea they can discover content by scrolling horizontally.
Comments
Post a Comment