As promised, for our first project in the series we will be looking at planning, designing and developing a small online store. A Photo shop no less. For what it’s worth, I’m a big believer in small businesses using their individuality as a means of gathering customers. In the online environment, I believe this can be used to great effect.
Our photo shop is a small gallery whose audience is generally from the mid twenties to mid forties. It prides itself on it’s quality pieces, knowledge of local photographers responsible for the work and its modern atmosphere.
They would like us to build them a site that reflects their values, personality and demonstrates the pieces in the best light possible. Luckily for us, they’re not too keen on Flash components, but they would like to see an automatically updating cart and for users to be able to click on thumbnail images to load up larger photos.
They generally have in stock between 50-100 photographic pieces at any particular time. Of these 2 or 3 new pieces come in each week, and every day they have a special on offer, usually at a reasonable discount of about 5% or so.
After some further discussion, we have determined they would like an About Us/History page, Contact Us page; in addition to separate pages for each photograph, the checkout and an additional page for the cart itself.
Straight away, based on the ideas about the store page and the discussion regarding stock and specials, we’ve come up with this rough sketch of our home page/store.
The central image takes precedence and allows the user to click on various thumbnails below and get a better idea of the product they’re interested in, as well as add it to the cart straight away if they wish. Next to this is our dynamic cart, with little thumbnail images to illustrate what items are in the cart at any one time, we will of course need to take into account what will happen when the cart gets bigger and bigger.
Our photo area is there too, although I’ve only sketched 2 rows of photos I think it will be neccessary to expand this to three or four depending on content. I could opt to paginate here, but this is a Photo shop, they need real estate.
Below our main content, we can already see the areas for our daily special and new to store sections as well as added info for our users to grasp at.
Through sketching these ideas down with the brief still fresh in the mind, it can give us something to work with as we start taking these ideas to our wireframe and design. For your own records I’ve sketched out the about us page, contact page, item page and checkout.
It has given pause for thought about how we can expect the site build to come together as well, by looking at the content areas we can start thinking about some of the database queries we will be looking to make as well as the structure of the HTML. Luckily for us our client is quite accepting of utilising some modern css3 techniques ( author’s perk), so we can look forward to implementing those down the track.