Empire State Trail
Role: Lead Designer and Illustrator | Client: New York State Parks Department | Tool: Arc GIS Map, Sketch, Invision Abstract
NY State site and an interactive map to plan a hiking and biking trip
The Empire State Trail is an initiative to create a 770 mile hiking and biking trail in New York State. The NY State Parks department wanted to build a communicative, responsive website that would enable New Yorkers and tourists to access all the information.
Project Goal
To have an online presence for the Empire State Trail
An interactive site with a trail map and detailed information to plan trips along the trail
Responsive mapping experience
My Role
Lead and solo designer on the project
Constraints
Reflect Geographical Trail structure in the site Navigation
Two-way interactions between the site elements and the map
Limited control on the Arc GIS Map Experience
Integration of trail attraction information from I Love NY into the map and the site
Outcome
Select screens from the finished UI
Final Screens from the Site
Interactive Arc-GIS Map
The interactive map is a key component of the site, helping the user navigate navigate the site to get to the relevant trail detail page
ARC Gis Map created by the development team
A major feature of the website was to have a interactive map of the entire trail that a user could see on a desktop website and on mobile. Arc-GIS
• Quick and intuitive navigation into deeper site pages
• Location specific information
• Customizable to match NY State Branding
Trail Detail Page
The 770 mile Empire State Trail is sub-divided into smaller 5-10 mile trails that users can accomplish within a day. On the site, each sub-trail has its own trail detail page containing all the information a user would need to plan a trip to it. The image below shows the key information hierarchy that would be relevant to the user.
Research
Physical Resources
Brochures for Cycling the Erie Canal and Cycling the Hudson Valley that included extensive information about attractions, biking routes, amenities and helpful information about planning a trip.
Digital Resources
AllTrails Website & Mobile App and other competing sites dedicated to hiking and biking
ARC GIS Story maps and Data collection document shared during the kick-off
NYState Parks & Trails Websites
Hudson River Greenway Site for the Trip Planning Experience
Who are the users? What do they need to know?
User Stories & Journey Map
Creating a user story helped to understand the context, motivations and outcome
Information Architecture
Visual Design
Since this website would be part of the New York State Government websites, we followed the State’s Branding Guidelines for Digital Products.
Secondary Colors
Primary Colors for Site
NYS Branding Color Guidelines
Typography
The communication typefaces used for the this site are Proxima Nova and DSari
NYS Branding Typography Guidelines
Illustrations
To create a cohesive yet distinct visual style for the 3 major trail legs, I created illustrations that would work as separators and go above the footer on each page.
