Online Shopping Website Project

The Internet is an integral part of our lives. With it, we communicate; gather news, network with friends and colleagues, and share information and resources. Today, we see many businesses – large and small – using websites as a platform to sell a product or provide a service. However, we have realized that there is lack of a free, user-friendly interface that independent business owners can use to operate their businesses online. We wanted to provide business owners with an easy-to-use online store interface to sell their products and services. The interface also allows Internet users to buy those products and services. The main purpose of the interface is to facilitate interactions and transactions between a business and its customers.

Functionality and Features
Our interface is divided into two sections: owner’s interface and customer’s interface. The customer’s interface is accessible to any user on the World Wide Web. It’s primarily purpose is to allow customers to browse and view products, and place orders for those products. The owner’s interface is accessible only to the business owner and requires an administrative login. Its primary purpose is to allow business owners to manage their product inventory and orders.

Owner’s Interface
In order for owners to successfully operate their businesses online, we implemented the following basic functionality: Log in to the owner’s portal, Upload and edit product images and descriptions, Manage inventory, Manage orders received from customers. We want owners to be able to operate their businesses online entirely, just as storeowners want to conduct all of their business operations on-site. By allowing business owners to upload product images and assign descriptions to their products, we encourage the owner’s sense of propriety over his or her business. We want to make the interface easy to use so that the owner has a great sense of control over the tools used to operate his or her web-based business. In order for all business operations to take place on the website, the owner must also be able to receive and manage orders from customers using our interface. To further facilitate the operations of the business owner, we implemented the following advanced functionality: Allow products to be categorized into groups, Allow shipped orders to be associated with package tracking numbers, Allow owner to send email notifications to all customers.

This advanced functionality is intended to facilitate the business owner’s communication with his or her customers, as well as allow the business owner to make his or her business more individualized. Our owner’s interface is primarily composed of 7 pages: Owner. This is the owner’s login page. The following 5 pages of the owner’s portal are for administrative access only and also require the ownercheck.inc page (i.e. using require () function). View_inv. This page allows the owner to view and manage the product inventory. It neatly displays in a table each product’s ID, category, title, unit price, last modified date, quantity sold, and quantity remaining. Inventory products can be searched by title, viewed by category, and modified and deleted from the inventory. Clicking on the product title will take the owner to the product page in the customer’s interface. Clicking on the “Modify” link will allow the owner to update the product information on the following page. Upload_prod. This page allows the owner to: 1) upload product information under the default mode, and 2) update product information under the “update” mode.

The owner can upload a product image, select a product category, and input product title, unit price, quantity sold, quantity remaining, and shipping costs. Manage_cate.This page allows the owner to manage product categories. The owner can add, change, or delete categories, and then commit to the changes or reset the form. View_ord. This page allows the owner to view the submitted orders. It neatly displays each order’s ID, product order information, customer information, order date, ship date, and customer feedback. If the product order has not yet been shipped yet, the owner can input shipping information on the following page. Input_track. This page allows the owner to input package tracking data for products in each order. The owner can select from the list an unshipped product order, select a shipping method, and input a tracking number and ship date.

Notification- This page allows the owner to send notification mail to all the customers. There is certainly room to expand and enhance the functionality on each of these pages. For example, the quantities sold and remaining can be automatically updated when a customer’s product order is processed. The view orders page can be implemented to allow the owner to correspond with each customer about an order if, for example, the customer’s submitted address was incorrect and the order needed to be canceled.

Customer’s Interface
In order to create a successful online shopping experience for the customer, we implemented the following basic functionality: Create an account (store and update account information, billing, shipping and payment information), Log in and Log out, Browse products, Manage a shopping cart (add, remove, change quantity), and Check out the shopping cart. In allowing the customer to create and customize online accounts and shopping carts, we ask him or her to share their personal information and build a relationship with the business. The customer establishes a presence on the website and commits to returning at a later time. The business owner is not able to access the customer’s private account information unless it is provided. The customer’s credit card information will not be accessible to business owners at all. To further enhance the customer’s online shopping experience, we implemented the following advanced functionality: Search for a product by title or description using a keyword, browse products under a specific category, and Browse the newest updated products.

This advanced functionality is intended to facilitate and enhance the customer’s shopping experience, as well as mimic some interactions that might take place in physical shopping locations. Our customer’s interface is primarily composed of 6 pages: Index.This is the main page of the website. It displays the most recently updated products in the inventory Browse.This page allows the customer to browse, search products, and view product pages. While displaying search results, it neatly displays a preview picture of the each product, the product title, and the product price. Each product page displays the product image, title, description, unit price, and product ID. It allows the customer to add the product into the shopping cart after inputing a quantity and – depending on whether or not there are product options (e.g. color, size) – choosing a product option. Signup- This page allows the customer to register for an online account. It requires basic account and user information, a billing address, payment information, and a shipping address. Account- This page allows the customer to update their online account. This page allows the customer to add products to information.

It requires basic account and user information, a billing address, payment information, and a shipping address. Online shopping cart and update their quantities. For each product in the cart, it displays the product preview image, title, option, unit price, quantity, and subtotal price. At the bottom of the page, the total price of the cart is displayed, and the customer has the option of updating or checking out the cart. The products are stored in the cart until they are removed from the cart or checked out and processed in an order. Checkout- This page allows the customer to check out the products in their shopping carts in 3 steps. The first step is to verify billing information. The second step is to verify shipping information. The third and last step is to verify the order. Once the customer verifies the order, the order is processed and confirmed.

There are two critical functions that are missing from this interface: The first is the credit card processing, a service which can be purchased through Network Solutions, a merchant account provider. The second is the certificate, which can be self-signed or purchased through a provider, such as VeriSign. Since the website interface is used to facilitate business transactions, it required the implementation of a certificate in order to protect the customer’s information from outside attack. However, given our time constraints, we were not able to implement that. There is certainly room to expand and enhance the customer’s experience on each of these pages. For example, each product page can be implemented to allow customers to recommend certain products to their friends. The manage account page can be implemented to allow customers to add more than one shipping or billing address – in effect, populate an address book. It would also be worthwhile to allow the customer to manage a cart and check out products without having registered or logged in. Database and Tables

The database for our project interface is composed of 10 tables. Below, we have briefly outlined the tables that are required for our database. The foreign keys and references also illustrate the table relationships: Customer: The primary key, customer_id, is automatically incremented. The table also stores the customer’s email address, first name, middle name, last name, birthdate, and billing and shipping address IDs. Address: The primary key, addr_id, is automatically incremented. That table also stores the name associated with the address, streets 1 through 3, city, state, zip, and phone. Payment: The primary key, customer_id, references the customer table. The table also stores credit card type, number, and year of expiration and month of expiration. Userpass: The primary key, email, is the same as the customer’s email address and is the customer’s login username.

The table also stores the md5-encrypted password associated with the account. Product: The primary key, prod_id, is automatically incremented. The table also stores the category id associated with the category that the product is in (referencing the category table), the product title, unit price, shipping cost, last modified date, quantities sold and remaining, description, and image type. Options: The primary key, option_id, is automatically generated. The table also stores the product_id (a reference to the product table), type of option (e.g. Color, Size), and the actual option (e.g. Silver, Black). Category: The primary key, cate_id, is automatically generated. The table also stores the category name. Prod_list: The primary key, list_id, represents an item in a cart or a processed order. The table also stores the product id, quantity of the product, and option id. A cart or processed order may be comprised of multiple prod_list entries. Cart: The primary key, customer_id, references the customer table. The table also stores the list ID, which is the same as the primary key for the prod_list table. Orders: The primary key, order_id, is automatically incremented and represents the order number. The table also stores the list ID (a reference to prod_list table), customer ID (a reference to the customer table), order date, and ship date. Programming and Implementation

We implemented our project using JOOMLA, MySQL and HTML and CSS. We chose JOOMLA over Perl/CGI and Java Servlets because our project goals were ambitious, and we are most comfortable programming in JOOMLA. There are many advantages offered by JOOMLA it is fast, stable, secure, and easy to use. By programming in JOOMLA, we were able to work quickly and efficiently and be able to implement some of our proposed advanced functionality. In this version of the project, the cart and checkout functions are only accessible to customers who are registered and logged in to their online accounts. JOOMLA provides very nice support for sessions through the superglobal variable _SESSION and session_start() and session_destroy() functions.

The functionality for the owner and customer’s interfaces makes heavy use of querying, inserting, updating, and deleting data. This resulted in significant form processing and manipulation of form data. For example, the signup.JOOMLA, account.JOOMLA, and checkout.JOOMLA pages had up to 27 text fields to be filled, over 3/4 of which were required fields. In addition to securing those queries and statements for form processing and deterring SQL injections, we also had to make sure that all of the required fields were filled before processing the form data. This required preparing several functions for displaying what essentially looked like the same form. We also gained valuable experience in file handling and error handling for file uploads. Technical Challenges

The structure of our project was far more complex than that of any of our previous homework assignments. It was critical and challenging to achieve efficiency in both interface – including optimizing page connections and minimizing the customer’s efforts in browsing and purchasing products – and back-end structure – including building table relationship, passing arguments between pages and managing overlapping parts of different pages, such as the header, and login table. To optimize page connections, we used an efficient network navigational structure, which can be summarized as: Browse and search functions, account information, shopping cart, and login options can be accessed from every page. We did this by required (i.e. using require () function) the header.JOOMLA and login.JOOMLA files on each page of the customer interface. Product pages can be accessed from any product-browsing page, the shopping cart, and order verification and confirmation pages (i.e. wherever the product image is displayed). Only the checkout process has a cyclical navigational structure, where you can return to a previous step to update the order information.

Conclusion
We hope that the website will become a successful interface for business owners seeking to open up small, online boutiques. We see that it has the potential to benefit a whole spectrum of business owners, from those technically experienced, including developers, to those with little or no technical background. Its stability, customizability, and user-friendly interface make it an ideal choice for facilitating online transactions and creating a satisfying customer experience.