I rebuilt the Flash Allebach website as a static HTML website with a responsive design.

The website is pretty simple, so I decided to use the static site generator Jekyll and used Jekyll Bootstrap to scaffold the project: a full working website with posts and pages with a template.

Jekyll Bootstrap provided a basic theme that is based off of Twitter Bootstrap which is responsive ready. This was incredibly helpful in crafting together a responsive theme for the website based off of the Flash website design.

Converting the website required: recreating the layout with HTML, CSS and JavaScript; recreating pages and content, with any links between them; creating news posts and reformatting their content; creating the work section.

The work section was the most challenging aspect of the project because there is no default relationship between pages and subpages (sections).

In order to create a relationship between a client and an asset (piece of work) for a client required setting a slug on the client that is also assigned to each asset.

This makes it possible to find pages where the slug is the same and this creates the relationship between clients and assets and among assets for a client.

The only aspect of the project that was outside of the scope of the Liquid Templating engine was the paging between assets. In order to create this relationship it was necessary to create a Ruby plugin that filtered pages by client and layout and then checked for any previous or additional pages.

Additionally the custom audio and video player were replaced by YouTube and SoundCloud in order to get cross-platform playback.

Jekyll proved to be incredibly flexible and at no point did the project become convoluted. Jekyll, Liquid Templating and the Ruby language proved to handle the job incredibly well and made the project easy to complete.

Homepage views

Subpage views

Work views