Composer

Brickly


Design

The site (this site) was designed as a portfolio of my work, so it’s very important to me that it is extremely creative and clear to use. Various mood-boards and UX designs were trialled.

Certain browser animations can be complex, fast, and smooth, and the design principle was to engage visitors through immediate and fulfilling illustrative animations. These would not be frivolous, but serve the role of a UI while create a clear UX pathway.

Development

By leveraging SASS, styling which would previously have required javascript can be accomplished easily with CSS. Furthermore, package management and a modern built environment allow better automatic support of older browsers, and quicker prototyping.

The site uses many animations which must be synchronised and sometimes reversed, for which I used the Anime-JS library. Since page transitions were also largely taken over by javascript, much of the site effectively became an state dependent app. Fortunately the power of ECMAScript 6 (compiled into vanilla JS though webpack) meant that the project could move from a functional to object oriented paradigm with appropriate encapsulation, abstraction and inheritance.

Find Enlight


The Client

The client was a zine producer who wanted an online outlet for their weekly collections of media. The requirement was delightfully difficult- my client had virtually no understanding of modern UX, and seemed to dislike the homogeneity which most modern sites adhere to.

Design

Full page video and animation enabled scrolling of the current collection greets the visitor, with simple archive navigation. The current UX reflects several drafts, including a working mockup site.

While underway, the client added various requirements- the site now had to be comment enabled, with permalinks for individual items and post descriptions. Not an usual request, but difficult to integrate late in the day. My solution was to have a sliding area to the right which contained the individual item’s meta.

Development

We looked at various platforms, but came back to WordPress since it could handle the custom taxonomies and complex queries needed to generate our content. These taxonomies formed the base of the project, since we needed to create collections of individual posts which themselves would have any of the attributes of a post itself. Once this structure was in place, the rest of the development continued smoothly.

Since the project uses Roots/Trellis to manage deployment, updates can be easily pushed from development machines without the need for myself as a dev logging into the production server. This has made applying new patches to the theme very easy.