Mission Brewery Mobile Website Mock Up
15
-
Upload
mario-telles -
Category
Documents
-
view
216 -
download
0
description
Â
Transcript of Mission Brewery Mobile Website Mock Up
SDCC MOBILE EXPERIENCE DESIGN 126 CRN 41522 MARIO TELLES EM: [email protected]
SDCC MOBILE EXPERIENCE DESIGN 126 CRN 41522 MARIO TELLES EM: [email protected]
Mobile Experience Design 126Drink ProjectMario Telles
Fall 2014San Diego City College
MISSION BREWERY
SDCC MOBILE EXPERIENCE DESIGN 126 CRN 41522 MARIO TELLES EM: [email protected]
Table OF ContentsObjectives :
Landing Page :
Beer Page :
About Page :
All Screens :
To show a mobile website that would scale.
Landing page on mobile phone and on tablet.
Bottle layout design and real life use view.
About the brewery layout design and real life use view.
A full preview of all screens together.
SDCC MOBILE EXPERIENCE DESIGN 126 CRN 41522 MARIO TELLES EM: [email protected]
Objective
To show a mobile scalable design:
Starting off with Mission Brewery was a daunting task. The website lacked cohesivness in its images and a very unorganized structure. Along with the mess they did not have a scalable mobile side. So my task I took on was to bring the companys colors, images, and overall direction together and display it in a mobile website.
However since this project was started the company must have read my mind, because they re-did the whole website. So instead of showing images of a before web-site, i’m showing logo’s that they still use that demon-straight how they are going in several directions.
SDCC MOBILE EXPERIENCE DESIGN 126 CRN 41522 MARIO TELLES EM: [email protected]
SDCC MOBILE EXPERIENCE DESIGN 126 CRN 41522 MARIO TELLES EM: [email protected]
Home Page
Two moble device views:
Landing on the home page has gives you a video about the company, and information about how the beer is created.
On the home page you get a facebook and twitter link.
There is also a menu and location icon that remain on all screens.
SDCC MOBILE EXPERIENCE DESIGN 126 CRN 41522 MARIO TELLES EM: [email protected]
Menu
Slide out menu:
I created a slide out menu for navagation through the website. The menu slides out from the left by tapping the menu bars at the top.
SDCC MOBILE EXPERIENCE DESIGN 126 CRN 41522 MARIO TELLES EM: [email protected]
Beers
Slidding over to highlight:
The company has very nice bottles and the color pallet is somthing I wanted to show off in the beers page. By sliding over the beers they highlight and info about the beers changes above.
SDCC MOBILE EXPERIENCE DESIGN 126 CRN 41522 MARIO TELLES EM: [email protected]
SDCC MOBILE EXPERIENCE DESIGN 126 CRN 41522 MARIO TELLES EM: [email protected]
SDCC MOBILE EXPERIENCE DESIGN 126 CRN 41522 MARIO TELLES EM: [email protected]
SDCC MOBILE EXPERIENCE DESIGN 126 CRN 41522 MARIO TELLES EM: [email protected]
The Story
The companys story:
This section talks about the companys history were they came from and why we have two Mission Brewery buildingsin San Diego.
SDCC MOBILE EXPERIENCE DESIGN 126 CRN 41522 MARIO TELLES EM: [email protected]
The Story
The companys story:
And about the new owner of the company, How he got his start.
SDCC MOBILE EXPERIENCE DESIGN 126 CRN 41522 MARIO TELLES EM: [email protected]
