Information about Creating This Website

Documentation of the Development Process

My uncle owns a local retail shop, called Uncle Sparky's, that specializes in providing tools for contractors, handymen, and do it yourself projects. My uncle's shop specializes in matching the correct tools needed for a job, packaging the tools together, that won't include unneeded tools. The shop is currently located in a small brick and mortar location but will soon be hiring a delivery driver and provide the convenience of placing an online order to be delivered directly to a local residence or job site. The website provides a means for a customer to determine what products they need and to be able to place an order for delivery. The goal of the website is to increase sales and achieve a larger percentage of the local retail market for tools. Since completing contract work and do it yourself projects often requires research before placing an order, by combining technical assistance directly on the website, buyers will be less likely to close the website to do research and then search for the cheapest price. The target audience of the website are contractors and middle-class families wanting to complete do it yourself projects in San Antonio, TX; therefore, this target audience is made up of time conscious, local customers and is anticipating around 1,250 views a month.

The products being displayed on the website have already included some technical research. For example, the hole tapping kits are bundled together by hole size and thread count and include the correct size taps as well as the appropriate size drill bit. The wiring page contains a chart that has the appropriate maximum current level by length for each of the wires being sold. There are three technical videos included on the hole tapping, wiring, and connector pages that are appropriate to the work being performed with these tools. For example, the hold tapping page has a video on how to properly drill and tap a hole in metal. Since the purpose of the website is to increase sales by making ordering more convenient, there is an easy to use order form included on the order form page. The user fills in a few blocks such as contact information and what parts in what quantities they want to order and submits it. The store will put this form information from the webpage and contact the user to complete the order.

Defense of the Final Product

Menu vs Parts pages: I broke the website down into two different types of pages, menu pages and parts pages. The menu pages utilized a dark background image with light colored text boxes (white and bright green). I chose to go with a dark colored background for the menu pages because there is only a small amount of text and the dark colors make these navigation options stand out. This creates a good visual hierarchy and makes the tools stand out, immediately providing the user with a clear business objective. I chose a background image that looks professional, but contains a very similar color palate, to prevent the user's eye from being pulled away from my call to action images. The parts pages have a large amount of text and tables, and a light-colored background with dark text will make it easier to read. I am using a wooden workbench background image to use for these pages. A light-colored work bench is often used because it makes finding small parts and tools easier by making them stand out. My objective is to provide a familiar image to our intended users, make a connection with them and provide credibility to my uncle's store. The contrasting styles between page types will quickly make the intention of the page clear.

Home Page (menu): The home page is going to going to contain the store named centered to grab the user's attention. Navigation links will be provided in the upper right-hand corner of the page, so that repeat customers who are familiar with the site can quickly navigate to their desired locations. Navigation links are also embedded in the images representing fabrication and electrical areas, which give the site a call-to-action that encourages users to click on the picture that represents the type of tools they are looking for. The background image and navigation images provide a clear business objective, which is to market and sell tools to the user. The child pages that can be accessed are the about page, order page, fabrication category page, and electrical category page.

About Sparky's Tools (menu): About page is an informative page with the company's history and why customers choose our store. This is a child page of Home Page and will allow navigation between these two pages only. I used a white test on the dark menu background image.

Fabrication (menu): Fabrication page is a menu page that will include appropriate image or graphics to represent fabrication tools. It is a child page of the Home Page and the parent page for all pages that include tools used for fabrication. This page has the company logo floating in the top left and the navigation in the top right. There is one image representing hole tapping that has a navigation link to the page built in.

Electrical (menu): Electrical page is a menu page that includes appropriate image or graphics to represent electrical tools. It is a child page of the Home Page and the parent page for all pages for tools used for electrical work. This page has the company logo floating in the top left and the navigation in the top right. There are two images representing the two child pages, connectors and wiring, and they have the navigation links built in as well.

Hole Tapping (parts): Hole Tapping is an informative page that includes a reference table that matches the drill bit size and tap sizes for a threaded hole and give a part number for each kit that is sold by the company. The table includes part number, hole size and thread count, drill bit, and cost. It also includes a table that has hole tapping tools that include part number, type, and price. This page is a child page of the Fabrication page and provides access to the Order Request page.

Connectors (parts): Connectors is an informative page that includes a table with the part numbers for the wire nuts that are sold by the company, what gauge wires they are appropriate for (max and min), color, and cost. There are also wire connectors which include the part number, style, wire size, color, and cost. It is a child page of the Electrical page and provides access to the Order Request Page.

Wiring (parts): Wiring is an informative page that includes a table of all the various gauge size wiring that is sold by the company and what maximum current rating it is appropriate for. The table includes part number, wire gauge, current rating for over and under 10 feet, and the cost per foot. It is a child page of the Electrical page and provides access to the Order Request Page.

Order Request (parts): Order Request is available from every page except for about and provides the user with a blank order form that can be completed to place an order with the company. This uses a form that can be submitted through the website with the customers information and the ability to place an order for up to five items.

Opportunities for Improvement and Growth

The biggest opportunity if I had time is to add more content. Even small stores are going to stock a large variety of tools and supplies, and I narrowed it down to three categories to concentrate on creating a functional and professional looking website. I would have liked to add quite a few more subcategories of tools. One of areas that I wasn't particularly happy with was the company logo. I attempted several different designs, and although the one I used looked the best in my opinion, it still had a less than professional appearance to it. If I had more time and resources, I would have taken the time to use a graphics design program to develop a more professional and personalized logo. Another area that I felt that could use improvement is the ability to adapt between narrow and wide browser pages. I worked with the formats and tried to use percentages as much as possible in my design plans, but the really wide screens still appear empty and the narrower screens appear to overlap awkwardly. The last area I would have liked to work with is the ability to auto-fill information on the order screen. When you are on e-commerce sites, you usually have the ability to add an item to a cart and the part number and quantity are automatically transferred to the cart. I would have liked to have been able to accomplish this.


William Gutshall
CS-320
Final Project