UI architecture for Newshub's mobile-first news website, built from modular components in Adobe AEM.

Newshub on an iMac

The brief

Newshub saw mobile use growing and wanted a mobile-first website. The mobile site had to look and feel like a native app. The desktop version needed many modules and components, all managed in Adobe AEM.

The design kept changing during the project and we had to keep adapting, so every component had to be modular.

Newshub on an iPhone

My role

I led the user interface architecture and worked closely with a larger team of AEM developers. Towards the end of the project I worked from Newshub's offices alongside them.

How it was built

We built the website from scratch on an internal framework that runs Gulp on top of Node.js, as a standalone static HTML project. Assemble compiled the partial modules into HTML files, which gave developers a long list of templates to work from. Gulp automated the development and generation of about 50 components.

SASS generated one large CSS file that became the core of the project, and a few modules needed JavaScript. CSS animation made the web app look and feel like a native app.

Newshub on an iPad
  • Node.js
  • Gulp
  • Assemble
  • HTML
  • SASS