Swansea University - Where Bright Futures Begin

The Swansea ‘Where Bright Futures Begin’ content hub is a full screen piece designed to show off the university and city to prospective students.

The page features a jQuery Isotope powered ‘perfect masonry’ layout intended to fill your full screen (of any size) with many different types of content tile, ranging from videos and statistics, to instagram photos and tweets. The layout and order of the tiles is completely randomised each time you load the page, and can be filtered between four different categories without requiring a page load.

Upon page load the tiles themselves are also assigned one of six possible classes to determine a different transition delay giving the effect of cards shuffling into place whenever the page is either resized, or the content filter has been used.

In addition to 119 tiles worth of content, it was also a requirement for the entire page’s language to be toggled between English and Cymraeg. I managed this by setting a data attribute on every text content element containing the translated text. When toggling language, the element’s text is replaced by the value of the data attribute; the replaced English language is then stored in an additional data attribute to ensure it’s possible to switch back. This brought it’s own challenge due to the sheer length of some Cymraeg words!