CYTIES

A field guide for the modern explorer, as they put it. Bars, coffee, style and where to stay, city by city, with a store that reads as part of the guide instead of a detour. Ryan Kirk and Travis Platt ran it, and I was their designer and developer for five years.

CompanyCYTIES
RoleDesign and code
Years2017 to 2022
The Los Angeles page on desktop, the map and the category filters under the city banner
The Los Angeles map on a phone, every spot pinned by category

City pages

Pick one and you get the spots worth the trip, each pinned on the map by what it is, bar, coffee, shop or hotel, with the menu fixed at the top of the phone so the next town is a tap away. Underneath, the pin type and the tags are separate, so when they wanted barber shops filed under style they added a tag instead of asking for a new map.

The store

The store began on Shopify as its own site, a photo of a shop with a red Now Open sign that I cut as a flickering video loop. Shopify’s Buy Button brought the product data into WordPress, so you shopped on cyties.com and only met Shopify at checkout, with the same logo, type and photography the whole way. It opened with Jack Mason watches, Topo Designs packs and Thursday boots.

The shop page on cyties.com, top picks with names, prices and brand, the products coming from Shopify
The store on a phone, Gear for the Traveling Man over the founders’ line, and the Jack Mason collection below it

Gear Grid

A new product for every day, numbered like a calendar, and a fresh page when the month turns. It keys off the month and the day, so the year takes care of itself. Every tile is tracked, and the buy link hands the sale to their affiliate networks.

The Gear Grid for September 2023, Mitchell and Ness as the featured brand above the numbered tilesA Gear Grid tile opened, the Marshall Middelton with its write-up and a Buy Now button

Getting to the story

The guide published as well as listed. You landed on New This Week, where Telluride with Huckberry led that week, picked a category, and ended up in a piece like Best Delis in NYC. Three levels down, and it had to hold on a phone the same as it did on a desktop.

New This Week on the home page, Telluride with Huckberry leading the week
The same week on a phone, each story stacked full width
The Lifestyle index, every story with its own photograph beside the headlineBest Delis in NYC, the story itself with the shopfront across the top

A template for each job

Every section got its own template. A story with a byline is not a product tile, and neither is a city map, so Lifestyle, the Sit Downs, the Garage, Album of the Week and the Gear Grid could not sit on one shell. What they shared was the brand. As their team grew, whoever was publishing that week opened the right template and the site still looked like CYTIES on the other side.

The Sit Downs indexThe Sit Down with Trent Valladares of HEX
Album of the Week, the week’s records in a gridThe Garage section, the DAB Motors Concept-E write-up
  1. The Telluride story on a phone, the Mapbox map of where to go
  2. A Seager product inside the Wardrobe section, with Buy Now under it
  3. The DAB Motors Concept-E in the Garage section

Keeping it running

The rest was upkeep, and there was five years of it. The site outgrew shared hosting and moved. Mobile speed fell off a cliff, so the whole image library went to WebP. Plugins, security, caching, which is what posts going up every week actually costs.

Pat has been a huge help! We’ve been working with him for several months now, he helped us revamp our current site, build an online store, and make constant updates. Our website is constantly changing and we are always needing updates on it. Pat has always been very responsive and easy to work with. Our previous web-master would take months to get tasks done, that usually only take Pat a matter of days. It’s very obvious that Pat is passionate about his job, and excited to take on new challenges. Every time we’ve had any online issue, Pat has been able to help solve it or help us find a better way to accomplish our goals.

An example of this was building an online store on our website, our website is built through Wordpress, but we wanted our store to be through Shopify, our issue was that we wanted the process to look seamless on our WP site, without looking like you were going to a different site. Pat found a way to accomplish this, and it works great! We highly recommend Pat for web design, site updates and ecommerce stores.

Ryan KirkCo-Founder, CYTIES