INTERACTIVE DESIGN - PROJECT 1


04.04.19 -
(Week X - Week X)
Feryn Juliesta Sulia (0336407)
Interactive Design
Project 1


LECTURES

Lecture 3: Web Standards
18.04.19








INSTRUCTION





PROJECT 1 - LANDING PAGE

Week 3

For our first project, we need to design a landing page for a topic that interests us. At first, I decided to create a landing page for a product line from a brand that I think is very nice. I sketched but finally didn't really use it as I came up with newer idea as I working on it digitally. 

For my first attempt, I decided to do a website for a product line from a cosmetic brand that in my opinion has a interesting packaging design.

Fig 1.1 First Attempt
But I finally decided to design a website for a Croatian cellist.

Fig 1.2 Another First Attempt
Fig 1.3 Landing Page Interfaces

Fig 1.4 Landing Page Interfaces (Description Box)
I finally looking up more websites I could find hoping that it would open my eyes to create a better layout. Here's some of them that I think quite helped me in opening my eyes; Bruno MarsNial HoranNorah JonesAndrea BocelliElla Fitzgerald.

Fig 1.5 Landing Page Second Attempt

Fig 1.6 Landing Page Second Attempt

Here's the final outcome:

*The rightmost page is only created to show what if one of the option on the upper right side is clicked. They will have this little block as underline under the selected option. 




FEEDBACKS

Week 3 

Mr. Shamsul said I can continue working on my topic and I can do a subscribe to get discount as my call to action.

Week 4

Mr. Shamsul said that my landing page is not there yet because I have no alignment and the title font size is too big. But, the call to action is clear. After fixing my landing page and asks for feedback from facebook, he said it looks like a real website and it's good.

Week 5

He suggested to put a little bit more space between the arrow and the albums section, also add a little bit more contrast to it.








REFLECTIONS

Experiences

Week 3

I was excited after I decided to design a landing page for this Croatian cellist

Week 4

I was a bit disappointed when I got a bad feedback for my landing page, but as soon as I got it I realised what I have not well considered in my landing page, I feel a bit glad that I made this mistake.

Week 5

Coding is very fun, I have never imagined myself learning something related to computer science before and now I think it is worth learning. 

Observations

Week 3

I think everyone is excited for this project as they execute an interesting topic for their landing page in their first try.

Week 4

I think my classmates are already put a lot of thought for this project as their landing page is looking good and accepted by Mr. Shamsul.

Week 5

I think everyone in very good at coding.

Findings

Week 3

I found that everyone is excited about this project and might have already prepared an idea before this class.

Week 4

I found that I have not enough knowledge and consideration when designing.

Week 5

I found that everyone really is passionate in design.


FURTHER READINGS

Android UI Design – Thornsby, Jessica
(Chapter 2: What Goes Into an Effective UI?)

This book overviewing of how views and layouts come together to create an effective android UI.

So as we already aware, Android apps are made up of activities. Typically, one activity is displayed at a time and this activity occupies the entire screen. Each activity is made up of views, which are the most basic component of a user interface. Views always occupy a rectangular area, although a view can display content of any shape. Some examples of the most commonly used views are; text view, edit text, image view, button, and image button. 

A view group is a container that groups other child views and ViewGroup objects together. One of the most common examples of a ViewGroup is a layout, which is an invisible container that's responsible for positioning the child elements on the screen. For example, LinearLayout is a ViewGroup also sometimes known as a layout manager that arrange sits child elements (views or ViewGroup) into vertical or horizontal rows.



















Comments

Popular Posts