Duke Farms, Improving Visitor Navigation & Engagement, 2019
Duke Farms, a 1,000+ acre nature and research preserve in New Jersey, needed an app that would help their 240,000 yearly visitors navigate the property and easily stay informed of events and educational offerings. The app needed to be available on iOS and Android platforms within 8 months of the initial inquiry, and 5 months after project kick-off. To keep cost and time down, the app would be based on the core infrastructure of another app built by the developer.
As the UX Designer, guided the info architecture, user flows and visual design. Consulted on the overall project strategy.
Sketch, InVision, Photoshop, Illustrator, Google Suite, Slack, Asana
Pitch mocks, application map, wireframes, prototypes, user testing recordings and findings, dev specs and assets, UI/UX bugs documentation, app store content and graphics
Site Visit and Competitive Research
I visited the property to get a sense of the environment, services, and general visitor experience. With no easy way to reference the property map, and no tour guide, I found myself disoriented for a little while when trying to return to my starting point.
We compared similar park apps to generate some ideas of what we did and did not want.
Empathy Map and User Personas
Duke Farms attracts a wide range of visitors, so we needed to decide the key characteristics and goals of our target users. To establish this focus, we sketched out an empathy map based on typical visitor interactions and my site visit. From that, I developed a couple of proto-personas and a list of other user groups for us to keep in mind.
Ideation and Application Map
We needed to hone in on what features and information we wanted the app to have. There were limitations because we were basing the framework on an existing app. We brainstormed some ideas, put them in an application map and determined feasibility with the developer. After a few revisions, we settled on an architecture that we could move forward with.
Since we already had a template for the app’s general structure and UI, I proceeded with creating mid-fidelity interactive wireframes to give the client a better sense of the app as we developed the design. Wireframes became hi-fidelity interactive mocks. With InVision, we were able to experience the prototype on our phones and the client was able to leave comments on individual screens.
I conducted a round of usability testing with InVision and Skype. I recorded 3 people going through a series of key tasks and documented their statements. Upon analysis of the results, I was able to produce a usability report detailing each task, synthesizing users’ actions and comments, and grading each key task’s error severity with recommended next steps.
In addition to this round of testing, the client invited several people to try out the test build. We were able to identify several more usability bugs from this fully-functional prototype, and made final revisions based on the feedback.
The App Store
I designed the app icon to be simple and recognizable while staying on-brand, produced app store graphics to spec for standard iPhones and the iPhone X, and developed app store content in collaboration with the client.
There were many ways we could organize the map filters and we needed to decide what to show for each one. Based on visitor data, we limited map filters to the most essential things users would need to find. We placed items in categories based on discoverability and importance. Less important park features were left ever-present on the map as cardless landmark icons.
We needed to provide an easy way for users to map their route back to the Orientation Center without an input tool. We decided to put a floating action button in the top corner that a user could tap to show the route. However, user testing showed that users didn’t understand what the floating action button did. So, we added a tool-tip that pops up the first time users access the map.
The client wanted to include many informational sections in the app, which required moving most of the links out of the main menu and nesting them on a home screen. The existing app UI structure had each link as an image spanning the width of the screen. We needed an easy way for users to see the most important links in the app at a glance with minimal scrolling. So, we changed the layout to a grid.
The client wanted to include audio tours for the property highlights and we needed to make the audio tours accessible. The design allows users to opt-in from the detail screen of each property highlight and provides a subtitles button that brings up transcribed text that highlights as the audio plays.
The iOS version shipped towards the end of June 2019. Our submission to the App Store was approved in a matter of hours. The Android version is scheduled to ship by early July 2019. User testing feedback has been highly positive and the client is excited about the release of their first app. We plan to collect more data on usability and business impact over the next several months for the next major release.