Description

Introduction

This website design was provided as a set of images and/or PSD’s that I have constructed into a functional webpage. All of the code including HTML, CSS, Javascript, XML, and PHP are written by hand for each website below. The site is fully responsive, meaning the same code is delivered on desktop and mobile with changes to the layout activated by CSS media queries and JavaScript.

Desktop

This project was designed to be a platform similar to The Camry Effect where users could share their stories as they related to BlueCross BlueShield and healthcare. The header shows uploaded images or video thumbnails from the various stories and events added or uploaded to the site. Users can browse through decades and eventually drill down to individual months using an intuitive timeline bar.

Utilizing jQuery Dialog boxes users could add events and individual stories for those periods in history. Using Facebook Connect we are able to grab a users profile picture in the event they do not wish to upload a photo on the site.

Mobile

The mobile presentation of this site differs so drastically from the desktop view that many functional elements are duplicated in the HTML with CSS media queries and JavaScript which hides and shows the appropriate elements and code which copies HTML, text, and current state info between desktop and mobile. This ensures that Ajax calls only fetch the needed data once that is stored in HTML structures accessible at a time of our choosing.

Legal

All trademarks and artwork of the Florida Blue Grassroots Timeline are property and copyright of Florida Blue and Zimmerman Advertising and may not be reproduced in any way for any reason with all rights reserved.