Project 3 Start

     My idea for a website is a super simple, stream-lined website that allows the user to easily, and quickly find food, entertainment, or shops around Detroit based around CCS. The user would be able to access this site any time of day, and get quick directions to the place they searched up.  The user would also be able to use the website to save his/her top 10 favorite found places for a quick look up.

     This idea is based off of the super easy flow of the Jimmy Johns mobil ordering website. after going to school her for almost 3 years my main problem is when its late at night and I'm hungry, I don't know where to go. As well as those lazy sundays of boredom. This app/site would solve that problem. 

Interaction 1 (Positioning Elements In-Class Exercise)

Step 2:

Step 3:

Step 4:

Step 5:

YAY

Interaction 1 (Website Revisions)

Here are my revisions for my website. For this I took what I had and made the pages work together a little better. I have an idea for this website where the you can access all the pages by swiping to the left and right (to make it desktop friendly and iPad/iPhone friendly.)

Here is the enter page. Just press the photo and it opens up the home page.

Here is the home page. From here you can either press one of the tabs on the navigation bar or swipe to the left

Here is the profile page (Brag Strip)

Here is the Map Submission page

I changed the store to be a little different that the other pages. Instead of car parts it will have Rat Rodders merchandise. 

Here is the tips and tricks page

And this is the competition/event page. The posters are on a sideways scroll bar.

So there ya go! Any feedback is appreciated 

Interaction 1 (In Class Assignment Catch Up)

Woops forgot to post this first lol. This was an in class demo

Code: Html then Css

Finished

And here is another in class demo of using web fonts
Here is the css

 Here is the html

Interaction 1 (Style Tiles)

Style tiles for my website.  Color idea, logo, ect.

Interaction 1 (Site Structure)

Here is my site structure for my Rat Rod Website

INTERACTION 1 (User Personas)

Here are my 3 user personas

Intro to Project 2

For my organization I chose Rat Rodders in the 30s and 40s. Its main focus is to provide local hot rodders with a place to show off their rides with others around the world.



      Hot Rodding started way back in the 20s, when young teens started buying old Model T's and removing parts and experimenting with performance upgrades racing in the street late at night or on the salt flats. These kids would take specifically Model T Roadsters and take off the bumpers, hoods, spare wheels, interior, and leave only the basics so it would make them light as possible.  
      Rodding really started to take off with the introduction of the Ford Flathead V8 in 1932. Producing a lot of horsepower at a low price.  Stops would then start milling bigger pistons and taking performance parts from bigger cars to put in their smaller cars.
      With the uprise of rodding in the early 30s, there were more and more instances of casualties with racing. "Speed Competitions" are what the police called them. In rise of this racers would move into dark empty streets and dry lakes but casualties still lingered. In an effort to keep rodding fun as well as safe, the Southern California Timing Assosiation was created. They created and developed a wide variety of timing systems to keep racing fun, safe, and more organized. It was with their help the first professional drag racing and hot rodding as well as rat rodders were created.
      My goal for the website is not only a place to show off young riders cars but a place for racers to find safe places to race. Places that can be submitted by users or by officials at the Southern California Timing Assisiation. Racers would also be able to comment and rate areas. Also allow pro drivers and mechanics to submit tips and tricks. As well as a place for organizations to submit competitions and contest posters. 

So far these are some of the pages I've made in illustrator. My next challenge is to try to incorporate it in HTML and CSS.

Here is the enter page

Here is the home page 

Here is the map submission page

Here is the profile page of the user thats called the "Brag Strip"

Here is the store

Here is the tips page

Here is the contest page

Interaction 1 (Step H)

I was finally able to get my server situation worked out. It is still transferring to go daddy, so in the next few days the server should be different but for right now its working right. So yea here ya go 

Wil Manera Design 

Interaction 1 (step ƒ)

These are the revised comps 

Interaction 1 (Domain Name, File Structure, and 8 Pages)

The domain name I picked was:  www.wilmaneradesign.com 

This is my file structure for the site:

And these are the 8 pages:

Interaction 1 (In-Class Project)

Yea

Interaction 1 (Textures and Color/Type Studies)

The textures I have chosen are here: on this imgur photo slideshow...
TEXTURES

And here are my type and color studies

Interaction 1 (One Thing I've Learned In My Life So Far)

The quotes I've decided on are: 

"Don't wait, or you'll miss the sunrise."

"Don't hope, do what needs to be done to make it happen"

"Running off at 30mph is not the best idea in the world..."

Interaction 1 (Site Hierarchy)

- When one first opens the page The first thing that draws the eye is the designers red logo in the upper left hand corner. (1.) Its bold color especially surrounded by the stain draw the eye to it first. 

- Next thing one sees is the large pictures. (4) One can see that pictures play an important roll on this website because the designer has put such an emphasis on them.

- Next thing was the headline/body copy. (2) Right center in the page this website is very blog-like

- Finally the last thing one notices is the navigation. (3)



- I thought this was a very different way of approaching a designers website since there isn't much in of an emphasis on the navigation. Especially with the contact information. Very nicely designed website, simple, and clean.

- When you fist open the page the first thing you see is the big red headlines (2).

- Next you see the content

- Then one notices the Nativagation page.

-Very simple and clean website. Easy to navigate, and to the point. The content although tends to look like ads at first.