Breadboard Electronics Website

Online Electronics Store

Home Page


The Breadboard Electronics home page was designed to balance efficiency, information and minimalistic design into one short page, incorporating both dark and light colour schemes in a well balanced manor.

When the website is not under maintenance, the section between the horizontal line and colour split is removed, and only the title, slogan, image slider and featured products sections remain.

As with the Featured Kits section on the Products Page, the Featured Products on the home page use a controlled order that are set in the individual product options, in this case, the products were ordered from importance, with the kits being the most important, then development boards and then components, this allows for a much more customised design and layout scheme, and ultimately a more personalised feel to the website.

Products Page


Following the standard products layout, with a twist…The Breadboard Electronics products page was designed using the same theme and layout as the Featured Products grid on the home page for continuity.

Using a basic blend of a grid layout, filtering and pagination, I was able to achieve an easy to use interface with all the functionality found in premium online retailers like Amazon and Game.

The functionality includes multiple product category filtering (right sidebar), visible product sorting, collapsible featured products section and a minimalistic and stylish yet functional design.

Account Page


The Breadboard Electronics accounts page has a simple, functional and logical layout allowing users to change their billing or delivery addresses on the fly through a front-end editor, and access circuit diagrams for selected products and kits. Password changing is also easily available using this page.

FAQ Page


The Breadboard Electronics Frequently Asked Questions page was designed to give users an efficient way to browse answers to simple questions without the need to scroll through a very long page, this is why I decided to use tabs for the different sections of questions and answers.

Throughout the development of this page, I also tried using accordions but the tabs layout was found to be the most efficient use of space and slightly easier to use in this case.

Support Ticket System


Using a similar premise as the tech support provided by the Novatech team, the support ticket system allows users to submit support tickets for evaluation by administrators.

A support ticket works similarly to a private chat, it allows a customer and staff member(s) to communicate on a 1-to-1 basis, this allows the customers to best share their issues.

The support ticket submission system allows for the customer to type in a subject, priority, department to contact and add a detailed summary, it also allows for the uploading of files if need be.

7158 Total Views 6 Views Today