Saturday, September 29, 2012

How to Design and Develop a Fully Functional Website: Fictional Sushi Roca Site Part 2

Where We Left Off

The last post was an introduction about the project "Sushi Roca" and I presented some basic graphic mockups for the fictional site. Here's the next snapshot of the mockup, and you can see how it's progressing.
Here's one of the first of many mockups I will produce. From this point I will come up with a few different variations of this mock and try to come up with one or two totally different looking mockups. It's a process and you should always give your client at least three to four mockup choices when presenting to them.

What Graphics Authoring Program I Use

I'm using Adobe Fireworks CS3 for mocking up and production. I actually prefer to use Fireworks over Photoshop for numerous reasons. It's user interface is extremely easy to use and it's file type support has always been vast. Photoshop use to be exactly what it's name implies and has only evolved into a web design authoring program. Fireworks has always been a program specifically for producing web graphics. Don't get me wrong though, I still use Photoshop for a lot of different aspects of my web design work and it's an indispensable tool in my arsenal.

Layout Breakdown

I've decided to use a 960 pixel layout just to stay safe. The reasoning behind the 960 is because almost every device will display the layout properly. I've added a few more content sections and an area where I might use some jQuery. The jQuery section is located where the single rolls in a line are. I plan to possibly create an interactive set of sliding panels so that the user can view the different rolls that are served at Sushi Roca. This could also evolve into a menu section where the user is able to click on the roll to add it to their pick-up order. For now it's just a concept in it's rough draft. At this mockup stage things can change very quick. Until next time guys!

Brandon Fowler
Web Designer & Developer
brandonfowler01@gmail.com

P.S. Start following me if you would like this demo to get more detailed and posted faster. Come on guys I need some incentive. (lol) 

1 comment: