Mobile Web

My thoughts through this process of designing coms for the SMC mobile web were mostly about content and visual design.

I wanted my mobile web to keep the colors and feeling from SMC website. If my mobile web has a similar feeling of design it wont loose its identity and people will recognize that it is for Santa Monica College. Because of that I choose to have the color blue gray and also orange because it’s the opposite color of blue.

My concept for the design is to keep it very simple, clean and modern. I liked the basic start of the current mobile website they have, so when I redesigned the mobile web I worked from their current one. I just wanted it to look more modern, personal and appealing. II gave it a little bit more style to the page. I tried to create different buttons, but I went back for the rectangular shaped ones. I felt like the square ones felt a little bit too much as the iPhone screen or a game, therefore not so serious. Even if I want the site to have a beautiful design I still want it to look as a professional school site.

To decide the content was a little bit more difficult for me. At first I wanted everything to have their own button on the homepage, but as I noticed that would not work. Therefore I started to divide the pages in to group, so for example instead of paying fees to have it own button it would be under fees information. I choose what I thought fit as a group and what was the most important and should be on the homepage.

New Sitemap

I have now done some changes to my sitemap to work with my website!

nyren_sitemap

Thoughts and Decision

 

The project for the Design Technology website has been a very teach full project for me. During our hours in class I have learned that there are a lot more behind a website then just a creative appealing design. There are reasons why the design looks like it does. But it is not only the design that is important for the site. The content and the function are also important. What is the information/content we want to give out to our audience and how are we going to do it?
Luckily after all of our classes where we had discussions about it, I started to understand what was important and the function of it. For me Design has always been rather easy for me to work with, but I have to say that for this project it was more of a challenge. I did not only have one type of audience, because there were so many more people to satisfy. I cannot have it appealing for girls by having it girly or for guys by having it masculine. It needs to work for everyone and that was a challenge for me. After many sketches and design comps I felt happy and decided to go with one of them.  I tried to make it clean, simple, with a happy and welcoming feeling.  I also wanted it to contain the information it needed to keep the costumers coming back. Overall I had a lot of fun and learned new knowledge within web design during this project.

Final Comp Designs

Here are new comps for the final design I am using for the midterm!

Web Comps

 

 

 

Web_comp1A

Web_comp1A

 

 

Web_comp2A

Web_comp2B

 

Web_comp3A

Web_comp3B

Wireframes

nyren_wireframing

Answers – Week 7

What are wireframes?
Wireframes are storyboards for the site. Also referred to as content layout or page schematics, these are non-design-oriented sketches of unique pages showing rough navigation, copy layout, graphic allocation, key headers, and many other elements that need to appear on a page. Wireframes shows a certain hierarchy of information but do not dictate exactly how something should be presented.

When do you not need to define key user paths?
If your site does not require the user to actually do anything task oriented (for example, fill out a form, log in, or purchase) , you do not need to define user path.