



After launching our redesigned 3-column Homepage in 2014, we realized we’d need a dedicated hero area to surface highlighted content. The challenge was to find a way for the edit team to curate and publish several different Homepage configs per day, without having to rely on bespoke designs and dev pushes for each story update. So, we built this WYSIWYG CMS tool to enable editors to input copy, graphics and text, and see an accurate visual representation of the three main resolution break points. The user begins by selecting a template, an image and its focal point. Copy can then be adjusted to fit the template. We added gradient darkening sliders to ensure that copy would read against lighter images. The user can then publish the story in all three resolutions to the various Mashable editions. The product was built with a team of two designers, a PM, and one developer with cross-functional input and research from the Edit team.