Your Shot Mobile

Business problem:

The Your Shot desktop site is a user generated photography community with over 4 million high resolution photos and was designed by a separate agency without mobile browsers in mind.

Our approach:

Because Your Shot has large, high quality photographs, we determined it was best to create a separate mobile site and experience to ensure the best performance across mobile devices and networks.

 

This approach consists of detecting the user's device and redirecting them to the mobile site (m.yourshot.nationalgeographic.com) if their viewport size is less than 600 pixels wide.

Technology

The mobile site uses the same code base as the desktop site, but has different templates for presentation. The team decided to use the AngularJS framework because it met the needs of the client and allowed the team to develop the mobile site quickly.

• AngularJS

• Python

• Django

• PostgreSQL

• Elasticsearch

Integration points/challenges

• Notifications service integration

• Heavy front-end work with only 1 full time front-end developer

• Membership header integration

• Commenting with Livefyre

Integration points/challenges

• Photo upload rewritten for mobile; most complex feature on the desktop site

• Photo rotation - new functionality for mobile

Team Structure

The Your Shot scrum team not only worked on the mobile site, but also worked on other projects at National Geographic in parallel.

 

• 2 back-end developers

• 1 front-end developer

• 1 QA

• 1 PM

Timeline

From discovery to development, the team completed the Your Shot Mobile site in 6 two week sprints.

 

We did a soft launch during the last sprint to select Your Shot community members prior to rolling off the project.

deck

By Jenna Terry-Warren