Role
Product Designer, UI/UX Designer, Graphic Designer, User Researcher & Interviewer
Team
Daniel Lionti(me), Ziyad Bulbulia, Qing (Rachel) Su, Elizabeth Silva, Vraj Sureshbhai Dudhatra
TimeFrame
January 2023 - April 2023 (4 Months)
Tools
Figma/FigJam, Illustrator, Photoshop, Mural, Usertesting.com
Our Project involved developing a prototype for a digital exclusive members' experience for a private outdoor adventure park called “ThePark.”. This product would need to handle signing in and out of the park, memberships, show information about ThePark, and it’s amenities, welcome applications, membership administration and usage, scheduling/announcing special events, manage monthly fees, handle vendor payments, and include safety features.
While ThePark would eventually cater to individuals with diverse interests, our project focused on outdoor enthusiasts, as was is still in early development and did not boast many facilities. Potential updates to the app could incorporate features to appeal to other audiences in the future.
A link to the prototype can be found on the left side of the page. Feel free to explore the prototype on your own, or wait until the App Walkthrough to follow along.
ThePark. (yes, with a period. From this point on I'll drop the period), is entrepreneur Chris Greenfield's latest venture. Nestled close to Mount Nemo Scout Camp in Burlington, Ontario, ThePark is an ideal destination for individuals seeking to connect with nature, themselves, and fellow visitors in a members only private park.
We worked directly with our industry partner Chris Greenfield for this project. Chris is a technology entrepreneur with over two decades of industry expertise. Chris is also the founder of TipTap Pay (https://tiptappay.com/), an innovative digital fundraising and payment platform tailored for charitable organizations and non-profits. Our team was assigned to develop an app for his latest venture, ThePark.
A photo of our group, Chris, and two of our professors touring the site for ThePark.
Among my roles as Product Designer, I was the main planner for the team. In the earlier stages of the project, I was involved in developing design requirements and project roadmaps, as well as assisting in making interview scripts and conducting interviews. In the later stages of the project, I was involved in coming up with product ideas, designing wireframes, creating a design system, mockups of differing fidelity, Prototyping, and final layouts.
I also helped take user testing data, ideas from the team, along with requirements & feedback from our industry partner, to co-ordinate the team on any changes that we would need to further develop the prototype.
I was lucky enough to work with a diverse team of hard working designers who leveraged their unique experiences and perspectives to enhance everyone’s contributions to the project.
Our team's type and colour library
This was not part of the project, but we thought it was a good idea for the team to have some sort of identity. It was also useful for our professors to know which team is which. There were about 6 different teams, each with their own project and industry partner. We were team EcoVoid, which sounded like a sick metal band, so I made a metal inspired logo. The nice thing about this logo is that I could easily change the colors to match the design of any presentation we made.
To better understand how our target users currently interact and navigate through parks, and how we could best implement our product, we interviewed 5 different participants. Each participant was an avid outdoorsperson with lots of experience with parks, the outdoors, and current digital products like AllTrails and other mapping apps.
Once we had all this data, we processed with affinity mapping.
Our affinity mapping process that we used to figure out what was most important to potential users.
Creating an app tailored to the needs of ThePark’s visitors is crucial for enhancing their overall experience and safety. Such an app must address the challenges faced by users in navigating ThePark’s amenities and trails efficiently, while also implementing any business and safety features required by ThePark. By providing features such as trail maps, real-time alerts, community engagement options, and safety features, the app will improve the park experience and promote safety.
Additionally, as ThePark continues to evolve, an app catering to visitors ensures that their needs are met effectively, contributing to the park’s reputation as a premier destination for outdoor recreation. Thus, developing this app is essential in fulfilling the diverse needs of park visitors and fostering a positive experience for all.
During the development of the prototype, several rounds of user testing were conducted using through usertesting.com. The feedback from these user tests was integral to the development of the final prototype.
Our final iteration of the app flow
In order to best illustrate the practical use of our prototype, we thought it best to provide a practical example of how a potential user might go through the app. Picture yourself arriving at ThePark. Upon your arrival as a new visitor, you see a sign telling you to download ThePark app. You to download the app and register as a new member.
After registering, you’re prompted to select from a list of membership plans, offering different options depending on what your needs are. After selecting your plan, the app takes you to the payment section, and once payment is finished, you’re redirected to the homepage.
Because there is quite a bit to the app, we thought it was a good idea to give people a rundown of the very basic features in the app. We also needed the app to handle user memberships, so we get that out of the way here.
We also needed the app to handle user memberships, so we get that out of the way now. Memberships will handle people’s access to the park and any perks that come with the user’s membership level.
Now on the homepage, you tap the “Check in” button at the top of the screen. The app guides you through ThePark’s check-in process, and once you are done, returns you to the homepage. This feature aids the park staff in monitoring your whereabouts and ensures that staff know where you are in case of an emergency.
The general idea here is that the app tracks users once they are checked-in. Park staff can keep track of these users and know how long they have been in the park. This is good for safety. Let’s say someone falls into a pit or something, park staff would be able to see that there is a user who hasn’t moved for a while and would be able to send a ranger by to check on them.
After completing the check-in process, you decide to go on a hike along one of the trails. You select “Trails” and are presented with a list of the park’s trails. Each trail is accompanied by a simplified overhead map that shows the general route and length. You opt for Trail 5 and tap on it. Upon tapping Trail 5, you’re directed to it s information page. Here, you can view the trail’s position, see some details about it, and access navigation.
Additionally, if you find yourself already on the map screen, you can tap on a trail to learn more about it and access navigation.
Trails are a staple feature of ThePark, and from our research, we knew that most people have run into general navigational issues before. Having a easy way to find trails around the park was important for providing users with a easy and relaxing experience on or between trails, but it was also key in preventing people from getting lost. We modeled our system off of products like Google Maps and All Trails.
Navigation is such a key feature for the product, so we made it accessible through many points in the app. A user can find a trail through the trails section on the home page, but they can also access it from the map or by scanning QR codes located around ThePark.
Once you’ve settled on trail 5 as your destination, you’ll still need directions on how to get there. Selecting “Start Navigation” provides you with precise directions based on your current location. Simply follow the directions provided and you will arrive at the beginning of trail 5.
Initially, users had no means to access additional information about trails they wished to explore—a crucial feature given that exploring ThePark.'s trails is a primary visitor activity. Recognizing its significance, we introduced this feature. However, through user testing, we realized its lack of clarity as users did not realize they could click on the trail overlay. Consequently, we introduced a "More Information" button, which later evolved into a more prominent "Learn More" button.
As you start your hike, you spot a sign along the trail. Pausing to examine it, you notice a QR code in the corner. Recalling the “Scan” button in the navigation bar in ThePark. app, you open the app and select the scan button. After scanning the QR code, a popup prompts you to navigate to the Trail 5 information page. Here you can view any information that has been posted by ThePark about the trail, or view images that have been posted by other community members.
The scanning feature can also be used as a payment method for any kiosks or vending machines that you might encounter along the trail. This means that the app can handle any payment you make while at the park and you don’t need to worry about carrying around a wallet or purse.
After capturing some photos, you decide to share them on ThePark’s Community Tab. Within the community page, you discover photos shared by other visitors. After taking a look at those, you tap the camera in the top right corner to upload your own. You upload the photo, write a caption, add a title, and tap “Share”. Your post is now published on the community page.
It was important to our industry partner that we had some community features, and we thought that picture sharing was a good place to start for the first phase of ThePark’s development.
As you continue on your walk, you suddenly notice a coyote stroll across the trail before you. Realizing that you should probably alert park staff, you open up the app and tap on the emergency button at the top of the homepage. Within the emergency section, you’re presented with the option to call assistance, report an injury, or report a hazard. Opting for “Report Hazard”, you proceed to select “Dangerous Wildlife” from the pre-filled options.
Once you’ve added a brief description and confirmed your location, you send and confirm. Depending on the nature of the report, sending the report will alert a park ranger and/or mark the hazard on the map to alert other members of the park.
Upon completing the trail, it’s essential to check out so that the park staff are aware of your intended departure. By tapping the “Check Out” button at the top of the home page, the app guides you through the process of checking out of ThePark. Once you’ve successfully checked out, the app returns you to the homepage.
Splash screens can occasionally pop-up while navigating through the app. These screens can showcase upcoming events, introduce new facilities or trails, or provide users with any relevant updates and information based on their interests.
Another feature involves showing user reported hazards within on the map. This allows visitors to view where hazards have been reported, such as coyote sightings, on their maps. The user is also able to tap on the hazard icon to receive more information. This helps enhance the awareness and safety for all users within the park.
Additionally, users will receive notifications about any important updates to ThePark through the app’s inbox feature.
Users can adjust their preferences and manage their account/plan in the settings.
The current prototype was designed with ThePark’s Phase 1 development in mind. Phase 1 is all about “Play”, which Chris defined as attracting people who were looking for an outdoor adventure. As the app gets developed and integrated with ThePark, it would be important to start looking at further phases so that way new features can be developed and ironed out when ThePark is ready for them. For example, Phase 2 focuses on “Work”, which Chris describes as, “Gathering Artisans and craftspeople to teach classes, setup workshops, create a marketplace, and build social programs for the community.” The app will need to evolve to add features that keep all these new activities in mind.
I learned a lot during this project. It was my first time developing a prototype of this scale. It was important to us that everyone in the group had equal say in any decision, no matter their role. Other than designing in Figma or Illustrator, my role was more as a planner, and I tried to take everyone’s input and use that to develop the our plan. I also wanted to make sure that everyone was happy with whatever they were working on, so setting up dedicated meetings for project development was key to our success. The roles were kept pretty loose, so people could work on different aspects of the project as they pleased.
I am also glad that I got to work on so many different aspects of the project. It was stressful at times, but it gave me a really good understanding about what we were designing and who we were it designing for.
I had never done any research and user testing with this many participants before (~15), so it was really interesting to see what people had to say. It was really fun to receive some feedback about what didn’t really work in the app and then rework the prototype to solve the issue.
Designing for Chris Greenfield was fun. We had several meetings/presentations throughout the course of the project. He is an avid outdoorsman so he was able to provide a lot of insight into what a user would want from an app like this.
Open to talk about anything work or Halo related, just send me a message.
© Daniel Lionti 2024