Questioning

Major Project begin

 

Part 6 : Reflection on creating a website

 { rationale }

Colors magazine is a quarterly magazine read by young adults across the world. Colors expressive medium : a method that is universal  and reaches  the greatest numer of people with a strong, immediate impact. Also,
Colors website is one of the most popular and critically acclaimed sites on the internet today.
Colors magazine aim to promote their magazine and ideas via internet and print. However , I realize the official website  is lack of layout and accessibility design considerable .In my mini website, I propose more considerable of design for colors magazine ; new layout , new style for it. Hence, people would
feel more comfort when they are browsing. They would easily found what they want to expect for the new website. Enjoy it !

My design process will be describe by following posts and that is my tough time when I was creating a website 🙂

Part 1 : Mind Map
Part 2:  Research and initial proposal
Part 3:  Frist navigation proposal
Part 4:  Second modified navigation and layout design
Part 5: Third modified wedpage layout design with precision in grid
Part 6: Reflection on creating a website

{ OUTCOME }

My mini website :  www.pikipo.com   ! There are 5 pages cross-browser support :

 AFTER                                                  BEFORE

     

| Home page |

      

| About page |

     

| Gallery page  |

      | Issues page |

      | Register page |

      | Contacts page | 

 { reflection }

I was apprehensive at the beginning of the semester when I realized we had to create a website as a part of the requirements for this Intro: web media class. I was unsure of where to begin. While it is true that I have been maintaing the content of the colors magazine website for a couple of weeks , I had nothing to do with its creation in Dreamweaver .  In fact , my tutor seb helps us a lots with showing the process of how to creating a website by steps , and I am straightforward just follow the guide.  I had never even used Dreamweaver or any other software to work on a website. During this semester , I am really pushing myself to start on it , and I hope to learn more about website design from all tutorials . I even spent many time I was never spent on explore a software . I borrowed books , I browsing on the internet , I asked some of my IT friends .  The result shows that I really successful by using basic HTML and CSS codes to create a website. I am happy thats uploaded on the server . The server supported my website works to other people to visit. I had learned in Dreamweaver to build a website that would highlight my experience and skills. It is also a good learning experience for me in the design of website . The most difficult part was trying to adjust the align in css for specific part, I try many of times for numbering the px in css. I create the site in over 12 hours and I then spent a further six hours making changes and tidying up the content.  I am enjoyable to see the live view of my design every times when I am making changes. I realized myself very engaged in the process as it was a creative task and the results of my work were immediately visible.  However , I found myself getting stressed when searching code of HTML , CSS and jS . I therefore didnt have time to explore more features of Dreamweaver. I am believing that would be lots of potential and improvement in the future.  But I am sure at this stage it is my best of outcome for the project.

User Testing :

The site testing task was handed to my friends. They said it was simple and useable website when they first looked at the site. They looked at the site content, they found it very easy to navigate and very easy to find information due to the purpose of the site was clear ,they said especially the title , the home page made the purpose very clear.

Refer to above (After + Before ) there are changes in each page {

Home page {
1.  I created 3 col for the pictures and paras, it was made more clear for eligible looking
2.  I added ” search ” label for people who want to search want they are more willing to look at.
3.  I added members login area , which is for people to be able to login to the site . Grain their
experience while browsing colors magazine website. They have ability to look at online magazines and further membership news.
4. I enlarged all icons ( facebook , twitter and Rss ) . They look more clear and bigger for people who want to follow up .
5. Grid is based on 16 col webpage design , now , I feel more comfort and more interest to keep my browsing.
6. Good changes on the navigation bar , more clear  and organized and i created color grey for mouse visting

}

About page {

1. Petty much the same , I changes some margin , padding , and typography in Css .

}

Gallery page {

1.  Pictures make bigger , clear
2.  Preview and next button for the finial version.

}

Issues page {

1. They can access to membership page  and look at online magazine
2. The public page only shows the enlarger cover and be able to have a look
the series of previews issues.

}

Register page {
1. I changed forum to register page due to more make senes for people to fill in the form and
access to login page.
2. Forum – they can click on facebook , twitter , or rss to express their ideas rather than making a
page of it . Feedback from my colleges , they dont willing to chick on forum page thats why I make a
change of it into a register page and make more sense to the website.

}

Contacts page {

1.  Typography makes more clear to read and aline just prefect

}

{ / changes }

Part 5 : Third modified wedpage layout design with precision in grid

Home page

About page

Gallery page

Issues page 1

Issues page 2- large cover

Register page

Contacts page

Part 4 : Second modified navigation and layout design

Part 3 : Before (This is my first draf for the navigation of colors magazine website)

Part 2 : Research and initial proposal document

Part 1: Mind Map for colors magazine (PROCESS DIARY START )

(Project on November 7, 2010 finished )Problem Design in Sydney – ” City ” – Australia

Develop MY skills in analysing and synthesising ideas and approaches presented in the lectures and tutorials (Tuesday and Friday) INTO my studio practice.

Telling what my project is about – what i did in my group work, and the ‘problem space’ I have mapped with your group over the weeks.

Ways of understanding what a city is, who a city is for, what interactive design is, and could be with the advent of new network-based technologies etc.