Graphic Designer & Web Developer
MacbookAir_6.jpg

Studio Twenty | Website Design

This website was created as a mock-up site for my WNM 608 class at AAU. I had to design a shopping site that pulled information from a database and put in onto the webpage.

 

This website was created as a mock-up site for my WNM 608 class at AAU. I had to design a shopping site that pulled information from a database and put in onto the webpage. You can view the full site here.

To create this site I had to use HTML, CSS, and JavaScript. I also had to pull information from a MySQL database using JSON, jQuery, and PHP.

The Process

About the Site

Studio Twenty is a mock-up shopping site that was created to combine other classmates products that they had chosen to work with. The site was designed to be responsive and to be able to pull information from the server-side to the client-side.

Basic Design

The site contains the following page designs:

  • Home Page - shows the newest product, along with a pop-up for free shipping that the user can close out of.

  • Product Index - showcases all of the products. This page is where is starts pulling from the server-side database.

  • Product Page - page is the same design for every product. This page is pulling information about the products from a database and displaying them based on the ID number in the database. The product pages also features a working product gallery.

  • FAQ Page - contains a flexible grid that changes as the screen changes size.

  • Contact Page - has a working contact form that will send to an email address, instead of just opening a blank email. This page also has required fields. If those required fields are filled out and the message is sent, the user will be taken to a thank you page.

Strategy and Concept

Programs Used

Adobe Dreamweaver
GoDaddy - Server Sider

Skills

HTML
CSS
JavaScript
PHP
JSON
jQuery