Comprehensive Report: Craft & Collectibles Shop Website Design

Verified

Added on 2024/07/03

AI Summary

This report outlines the design and development of a website for the Craft & Collectibles shop, focusing on providing customers with information about the shop's layout and available items. The website includes a welcome message, a floor plan navigation map with clickable sections for different item categories (coins, stamps, origami), a shop description, and a blog page for additional information. A product page lists all available items with short descriptions, prices, and user reviews, with detailed information accessible by clicking on individual items. The website also features a testimonial section with customer reviews, a working hours display, and a footer with contact information, quick links, recent posts, and a newsletter subscription form. The report concludes with recommendations for future enhancements, such as online purchasing capabilities and GPS integration.

CRAFT AND COLLECTBILES SHOP
Report part(A)
1

Paraphrase This Document

Need a fresh take? Get an instant paraphrase of this document with our AI Paraphraser

Table of Contents
Introduction........................................................................................................................................... 3
TASK A:.................................................................................................................................................. 4
General Requirements by the managers of Craft & Collectibles........................................................4
Procedure to completion of task....................................................................................................... 5
Website design top to bottom overview...........................................................................................5
Rough sketch of each page in website...................................................................................................9
Index page......................................................................................................................................... 9
Product page................................................................................................................................... 11
Product description page.................................................................................................................12
Our blog pages................................................................................................................................. 13
Working hour page..........................................................................................................................14
Recommendation................................................................................................................................ 15
Conclusion...........................................................................................................................................16
References........................................................................................................................................... 17
2

Introduction
Craft & Collectibles is a sole-proprietor with a proper shop front (i.e. an actual physical
building where business is conducted). The purpose and objectives of this report is Design and
develop a website to provide information to customers who wants to visit the shop. The goal is
to allow customers to obtain an overview of the shop layout and to find details of items
available from the shop. The website is not an online shopping site. The website’s main goal is
to provide information to customers who want to visit the shop in person.
3

TASK A:
General Requirements by the managers of Craft & Collectibles
 A potential visitor who visits the website will be greeted by a welcome message and the
following layout of the floor plan (navigation map) of the shop.
 When a visitor clicks on any one of the specific sections, it should bring up details of the
specific display selected with relevant type of items.
 The visitor clicks on any of the images of the item to obtain further information on that
image.
 In addition, if the visitor selects an option to display opening hours, a separate page (or
window) should appear to provide this information.
 Each webpage of the website must display the Logo.png logo. You can edit this image,
but the font style, type and colour must remain as in the original image.
 Do not change the description of the images. Do not rename the filenames of any of the
images.
 All images of each item must be presented/displayed to the visitor. This can be done
within one webpage or distributed across several web pages. The idea is to ensure that
customers are made aware of the complete selection of items available to browse.
 The images are to be used as it is. You can resize the images retaining the original aspect
ratio, but do not crop or edit (e.g. recolour, touch up, sharpen, etc.) or rename the images
in any way.
 Generate a separate page (this can be a popup page or a standard webpage) providing
the opening hours. Use the details found in the Business_Hours.txt file.
After reading all rules and instruction and the important features which we are insisted by
manager of craft and collectibles, our aim was to design a website which can carriable by user
of every age, for that purpose, to design the best and trouble-free website, we follow all the
stages step by step, the steps are
4

Paraphrase This Document

Need a fresh take? Get an instant paraphrase of this document with our AI Paraphraser

Procedure to completion of task
• Carried out user and task analysis: - we have dealt with user variation such as age or language
skills. Performed a user analysis, i.e. characterised the users and identified our potential users.
Clearly identified the tasks the potential users perform, and in what order.
• Propose design and system requirements: - after taking suggestion from the various type of
users, and after analyse the requirement of client, we have created a simple and basic website
design, and ask the people to give their feedback, and we examined them and made some
changes so, the final design contain the following menu’s in order given below,
Website design top to bottom overview
1. As describes by manager that they want logo of craft and collectibles as it is without any
editing, so we put the logo in top left corner of website without any change, in top right
corner we put the menus of navbar. And gave suitable font style to them.
2. As describes by manager that they want welcome page in starting of website so to give
an attractive look we gave the parallax design for website, a unique navbar designing
and create animation with wonderful quote which changing its colour while sliding
from black to white , In background an image of craft and collectible shop picture in
black and white format, we named this section as HOME section.so if you click on
HOME menu from navbar, it will automatically take you from top to particular page.
Because this website has the feature of auto scrolling.
3. As describes by manager that they want floor plan after welcome page so, we create
another section and named this section as FLOOR PLAN section.so if you click on
FLOOR PLAN menu from navbar, it will automatically take you from top to that
particular page. In that page in right side some raw text written which means the
paragraph which describe the shop floor structure, and define where customers can buy
what type of material, in the left side we put an image of floor plan as provided by
manager and three item type on that image named as coin , stamps, origami. These are
5

the three buttons on the images which takes to the product available on the shop .so as
user click on any option from given three type items they redirected to on that type of
items, so as we click on coin section they can visit the coin section automatically.
4. After that the third section is about shop description which give the information about
shop, that when it is established and who is owner of shop, what type of shop Is this. So,
it is small paragraph. Here in place of that we wrote some raw content.
5. There is one button with a text written over on it as view more, so anyone click on that,
they reach to other page which is blog page, they get to know more about the shop and
importance of art and craft, by reading blog present on that page. There are three
different images are listed and their description, date of establishment and their
importance are written. On top of that page the header contains navbar menus and that
content bottom of navbar and at the last the footer section. Header and footer are
common on all the pages
6. After that section we lead toward the section named as collection and a raw paragraph
which describe the collection of shop, below that, it indicates three items in the row
which is type of item that the shop having and as you hover, there type of item will show
with some decorations. These images indicating what kind of items the shop contains.
Below that section there is a button which will leads you to another page named as
product page. Which will give you detailed list all items of shop and their short
description. For full description you need to click on the image of product further.
7. As you entered on that page, you will see. As we have the list of all items present in shop
which provided by shop manager. so, we listed all the items one by one, and each type of
items in particular portion so we provide the first portion for coin, which listed all the
coin in horizontal list and name of that coin below an image. Under that, the cost of that
item and review by public is categorized. We gather more information about particular
item simply by clicking on them which leads us to different window. Where we can
view the whole detail of that item,
6

8. next type of material are stamps and similarly we listed them one by one in horizontal
list and name of that stamp below an image and the cost of that item and review by
public is given We gather more information about particular item simply by clicking on
them which leads us to different window. Where we can view the whole detail of that
item.
9. next type of material is origami and similarly we listed them one by one in horizontal list
and name of that stamp below an image, the cost of that item and review by public is
given. We gather more information about particular item simply by clicking on them
which leads us to different window. Where we can view the whole detail of that item.
10. So, as we finished the all item from collection of shop, we move toward next section, the
name of section is testimonials, where the prestigious, reputed persons who uses the
services of this shop from very long, gave reviews about that store, so this section is
displaying those comments. The testimonial section is made under carousals, so they
automatically swipe one by one through each comment. testimonials framed by one
picture of person, the designation of person and comment by person for shop. We can
make them slide by clicking on two arrows of left and right.
11. The next section named as working hours, the customer who are sitting at home can
view the time at which the shop would remain open. so here the schedule of shop
opening hours of each day. And it shows the holiday, if they want to see further details
then they can click on the button named as view more, so other page will open which
shows the current status right now.
12. The other page named as businesshour.html. so, as someone wants to look further the
opening hour then he can click on the button which leads that person here. The page
contains the navbar and its menus, the opening hour detail and below that the button to
go back to main page and at last the footer.
13. The last section is footer which divided into four parts the first column contains basic
information like location and phone number and services of shop. we put logo on top of
7

Paraphrase This Document

Need a fresh take? Get an instant paraphrase of this document with our AI Paraphraser

footer too. the second column contain the quick links so as user click on them, they
directed to them. the third column contain recent posts, and last column contain
newsletter subscription form.
14. Last section is the copyright information of website.
8