With responsive web design still in its infancy and Foursquare's desktop site not optimised for the growing number of mobile users, Touch Pages offered a bridge. This mobile-friendly web layer ensured anyone without the app could seamlessly view shared content on their mobile phone while providing a clear path to installing or opening the app directly.

Touch Pages was the first project I worked on at Foursquare, collaborating remotely with the back-end engineering team in New York while I was still based in Scotland. We worked in shifts—I focused on front-end and design changes during my day, then handed things off in the evening for the team to work on back-end implementation. The process was fluid: changes were pushed to our internal development server, which made it easy to test and iterate quickly despite the time zone gap.

My initial plan to design in Macromedia Fireworks took a turn early on, as I decided to pivot by designing and building directly in the browser. This real-time approach allowed for rapid iteration, particularly when fine-tuning the pages' responsiveness at different sizes and also enabled me to prototype various interactive states and CSS animations.

Introducing a mobile web experience extended the accessibility of Foursquare's content beyond its mobile and desktop applications, making it easier for people to browse shared check-ins, read tips, and explore venue details from their phones.