scroll
Samsung
2015
Lead Designer & Developer
Designed and developed product pages for Samsung Australia, for the Galaxy line of phones, tablets, and accessories.

While I was working with the Gadget Group in Sydney, we received a brief on the need for new product page microsites for the Galaxy line of products. I jumped at the opportunity to lead the project.

After coming up with a design strategy and a few rudimentary mockups, I had the exciting opportunity to pitch the work proposal I'd developed to Samsung Australia alongside Gadget Group's Managing Director.

Project proposal and strategy work

The meeting went great, we got the project, and I started making detailed mockups and developing site specifications. A few meetings and many emails later, with a specification in hand, we were ready to start building things.

Mockups and technical details

I wanted to be able to work with complex HTML structures more easily, so I designed and coded a site building mechanism that let me split files into parts and assemble those parts efficiently, to minimize code repetition. I also designed the site builder to allow the use of templates with variable data, so that we could easily build microsites for additional products more efficiently, rather than reconstructing all of the HTML structure and SASS  → from the ground up each time we wanted to make a site for a new product. This also made styling changes that applied to template parts much easier to control.

The specification we'd developed also had unique requirements for scrolling behaviour, but we wanted to make sure it degraded gracefully, so I ended up writing a lot of Javascript as well, and doing a lot of cross-browser compatibility work. And of course, the site had to resize nicely and accomodate everything from mobile devices up to widescreen displays.

Video screen captures of the live sites across devices

My role also involved managing all assets for the project, so I tpok care of file organization, image compression, and webfont conversion of Samsung’s custom font faces.

I designed an icon font to take care of the many pictographs we'd included in the microsite's look. And because my pet peeve is slow load times, I ran speed test on the parts of the pages I could control to make sure the code and assets Samsung would be serving would load quickly.

Glyphs created for the icon font used across the sites

Finally, I wrote shell scripts to automate the process of building the site for both local development, and output on Samsung's staging servers. At first it seemed a bit odd to devote an hour to automating something that only took a few minutes, but with a bit of inspiration from the webcomic XKCD  →, I crunched the numbers and discovered it would actually save me a ton of time.

The initial project had involved building a page for the Galaxy S6, with the potential for other products in the future, and since the project has started I've ended up creating pages for the Galaxy S6, Note5, Tab S2, and Gear S2.

←  previous