0% found this document useful (0 votes)
23 views7 pages

Homepage

The document provides details on the design and features of a new website for Konnect Me Now. It outlines 10 sections for the homepage including a full width menu, main banner, product showcase, marketing banners, product ranges, installation services, and call to action banners. It also provides details on the design of other key pages like the product catalog, product details, checkout, and installation pages. The document specifies the desired functionality, layout, and content for various page elements and features of the new website.

Uploaded by

Muhammad Arif
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
23 views7 pages

Homepage

The document provides details on the design and features of a new website for Konnect Me Now. It outlines 10 sections for the homepage including a full width menu, main banner, product showcase, marketing banners, product ranges, installation services, and call to action banners. It also provides details on the design of other key pages like the product catalog, product details, checkout, and installation pages. The document specifies the desired functionality, layout, and content for various page elements and features of the new website.

Uploaded by

Muhammad Arif
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 7

Homepage

PLEASE NOTE HEADER AND FOOTER IS FINALISED ONTHE HOMEPAGE ONLY OTHER PAGES ARE
NOT UPDATED.

Konnect Me Now website will be a full width layout.

1. Full Width Menu


This will be full width with icons and once expanded it will display categories, brands within
this categories and custom box which i can rename and replaces images.

2. Main Banner
Full width banner with the main content page overlapping and being able to embed video.

3. Select Category (Main product showcase)


We will display 8 products from each category that is listed above with an icon (note this icon
will be different to the menu and it will automatically change categories within 10 seconds,
active category will be highlighted in orange and other as displayed on the image.
I will talk about product box last.

4. Marketing Banners
There are 2 marketing banners which i would like changed every few seconds. Would like
options of having atleast 3 banner each with just simple image and a link. This can be like a
slider with a little round indicator (for all ads and marketing banners on the entire site)

5. Product Range
This is quite simple, we will show a image of main category and from main category it will
display subcategories.

6. Installation Services
If clicking on the main installation services title it will take us to main installation page (will
show you later) and if they click installation item it will take us into the details of that
installation service.

7. Call Us or Contact Us Banner


This will simply take shoppers to our contact page.
8. Brands We Carry
Module is already installed, under the images there needs to be a link to browse more brands
just take a look at our existing website.

9. Site Footer
This is going to be the same through our the site the complete one is on Homepage PSD and
the rest are old so please disregard the rest. I need to update the testimonial icon something
like round with a persons face in it if you have anything like it please let me know.

10. Product box will display brand, promo banner, product title, product image, promo text,
availability, price and add to cart or let's talk.

- Price tag's will depend on the number of digits as shown, price tag will have a sale price
which will be higher, show retail price and savings in dollars. As mention the font for price
ticket have made by hand can you please help us out with to find a similar font.

Product Catalogue Page

1. Banner Advertising will allow us upto atleast 4 banners, this will be like a slider with a round
indicator.

2. Shop By Category will only be shown when a parent category is clicked, otherwise it will
display Product Filter.

3. Product filter, add to cart, page scrolling will all be in ajax as shown.

4. Another 2 ads banner on the left side same apply with slider and round indicators

5. Newsletter sign up box.

Product Details Page


1. Social media icons for sharing the product.

2. Best seller is same as promo banner (also shown on product box through out the site), this
promo banner will have text which we want to just type in backend and the background will
just be a solid colour which we also want to define from backend.

3. Promo text is the same text on product box (shown through out the site) we want to have a
few predefine text and also able to just add new ones, also be able to define colour from
backend.

4. Attribute Icons, Shown upto 7 and only on this page but not under specification.

5. Through the site we will have 3 descriptions for product


1. Short Description - Shown on checkout
2. Description shown under product detail page will bullet points (css required)
3. Full Description shown under description tab.

6. Review and Add to Compare - Review we will add from one of the review providers but for
now just use the stars and built in review system we can get to adding this later
As for add to compare im having trouble figuring out how to display this on that space can i let
you know it will just either be a icon or simple text.

7. Delivery estimate, will give option from temando in a dropdown which will show customer
their location and option from temando and will always shown deliver cost as long has
customer has provided a postcode. example provided http://www.appliancesonline.com.au

8. Installation Service
- Limited to a certain postcode (will provide postcodes) if customer provides postcode which is
not serviced it will show installation not available in your area.
- Acts as an item
- Will be different to different items for example
32 Inch TV - Installation 32-60" TV $219
84 Inch TV - Installation 65-84" TV $399
- We will add installation options manually.
- Checkout page this will act as an item with a product thumbnail and not just as text under
product.

9. Customer Care Plan, We are planning on adding the extended warranty in the future but for
now this will just pickup data from backend we have a field called warranty and it will just
shown in the dropbox and say X Years Manufacturer Warranty, this will also be shown under
checkout see image provided..

10. Product Option will be available only for product with option, drop down will show all
available options once clicked.
11. Grouped or Packaged Product is also part of our website which will be shown pretty much the
same but instead of product description it will display the items that are in the package.

12. Full Description tab, i want this to be a little flexible in terms of how we show description, I
want the text to also have same size, spacing, weight and colour for titles and well as
paragraph, we should be able to change image either on the left, right, top or bottom but
shown balanced with paragraph. You tube video with the grey background, title option and
same size youtube video player. This has to be added from description as i want to control the
positioning of the video.

13. Enable the specification tab to see self explanatory

14. Warranty and returns we have a attribute field already

15. Delivery will show same content as checkout page.

16. Downloads - I would like option to attach PDF file from the product editing page from backend
and in front end just shown the name and PDF icon.

17. Customer review as of now just a built in review system we might go with reevoo in the
future.

18. More from this category - Just shown more from the same category and also have option to
show more when clicking the arrow.

19. Add to Cart Shadow Box - Enable the group in psd file to see, well self explanatory, related
item once added it will show added to cart like for product box.

Checkout Page
1. This is quite self explanatory all i would like to mention only thing missing from the design is
how the summary information is provided for the GST please check out current site and we
need it to show GST total and grand total the same.

2. Next page with customer detail and payment im working on i hope i can give this to you
tomorrow or day after.
Installation Page Main
1. We will have image, and enter text from backend that appears on the image with a green
button.

2. Each image will cover the full screen and when scrolled down the next image is displayed just
like on this site http://www.control4.com/spaces. Same way nice and smooth.

3. We will be adding a few number of these at the moment i have provided only 4 images and
text.

4. Once the button on images are clicked it will take them to the next page which i have also
provided called installation subpage (these are all CMS) with a little menu up the top.

5. I also want 1 page where the menu is there and also have the big images when scroll it show
the next big image but the menu overlapping just like on that site.

6. We have quote forms already built on the site when we click get a quote either it will open up
that specific form or a contact form to provide their name, number, email and message in the
shadow box.

7. CMS For service pages will allow us to embed youtube video, images, link to products,
separate menu.

Major Products Page


Special Product Page

This is where we will promote products i have seen this on other sites but not sure how it is done so
im looking for recommendation..

after clicking the product it will just take you to the main product view page.

Also i want option for some pages we have images left align and then right and some we just want
right or left aling,..i think this will be css setting.
Other Features
I will first explain how our pricing works we have 3 pricing options

- Suggested Retail Price


- Normal Price
- Special Price

Please also refer to homepage image for examples.


All producst displayed are for product with SRRP only different is product custom availability

Product Status

1. In Stock
2. Out of Stock
3. Available
4. In Stock
5. Pre Order
6. In Stock
7. Out of Stock

Button Text

1. Add to Cart
2. Contact Us
3. Add to Cart
4. Let’s Talk
5. Add to Cart
6. Add to Cart
7. Discontinued

Action

1. Add to Cart
2. Contact Us
3. Add to Cart
4. Contact Us
5. Add to Cart
6. Add to Cart (with pop up)
7. No Action

Custom Text

1. Ready for shipping now


2. Contact for stock availability
3. Ships in 2-3 Days (2)
4. talk to the AV experts
5. able to enter custom text

Basically what is in the box shown as contact for availability, in-stock and available are the product
status. Button text will be shown in product detail page same and with the custom text.

Action is basically what happens when customer clicks the button we want some to open up contact
us form in a pop up with subject being the product title, customers details and message box for
customers.

When the price is more than 2 digits the orange price box will be wider (please look at homepage
image the 3rd product).

When we put normal price and SRRP it will only show normal price (please look at homepage image
the 2rd product).

When we have a special price it will show a on sale banner, price will show SRRP with a line through
it instead of ticket it will say RRP, the sale price will be shown under in bigger font and saving
calculated from rrp will be shown (please look at homepage image the 1st product).

All products will have a option for custom promo text (this is the text under the product image and
will be able to select different colours.

You might also like