Georgia Waters App

in Graphic Design, Responsive Design, App Development, Brand Identity

“Live. Love. Kayak.” A Mobile App that lets you search for your next paddling adventure in Georgia. Designed to be engaging, responsive and informative – so grab your paddle and get outside!

View of the Georgia Waters app on an Apple iPhone 15 Pro.

PROJECT DATE:

Fall 2023

MY ROLE:

Copywriter, photographer and app developer.

PROJECT OVERVIEW:

For this project, the goal was to design an easy-to-navigate app that is engaging to users, easy to navigate by all users, responsive to different screen sizes and features a clean minimal design that is visually appealing. The objective was to stretch my novice app skills further by incorporating new elements into the design, while not overcomplicating the app with unnecessary views or elements that could frustrate users by making the app harder to navigate. Because Georgia’s diverse landscape offers some excellent scenic locations for paddlers of every level to enjoy, I chose to create an app highlighting some of Georgia’s most picturesque outdoor getaways.

THE PROBLEM:

How do I create a unique app that offers numerous locations for beginner to advanced paddlers with advice to help users pick the perfect place for their next kayaking adventure? In doing so, what code could I use to enhance user interaction with the map? Finally, how do I create an app that utilizes the Swift UI coding skills developed during the semester, while also incorporating elements or CSS formatting not covered yet?

An organic color palette relfects the environmental nature of the Georgia Waters app.

THE SOLUTION:

I began by taking inspiration from hiking trail apps and websites that I use to find new trails to explore in Georgia and around the country. This research not only helped inform what types of information would be helpful to users, but also the overall aesthetic from colors to photography to language that is appealing to outdoor enthusiasts.

Brainstorming requirements for the functionality and navigation of the app.

Next, I began researching kayaking locations in Georgia, including some I’ve explored and new waters yet to be paddled. My aim was to find eight locations that appealed to the vast majority of paddlers no matter the skill level. Ultimately, I decided to include scenic locations near the metro Atlanta area or in North Georgia perfect for a weekend getaway. I also looked at what type of content would be uniquely relevant for a paddler before selecting a kayak location.

For the Georgia Waters app, I created three views: ContentView, MapView and MidtermSources. The primary views are ContentView and MapView. The MidtermSources view included photography credits and code source and tutorial sites, along with URL links to the sources used.

Georgia Waters app data set.

For this project, I created my own data set. I extracted the data using NavigationView code as a list. I used ScrollView code to ensure easy navigation of the kayak destination list. In addition to including a static image from Google Maps of the location, I pulled in coordinated from MapView so users could view each location from a satellite map view.

To create the MapView code, I used code from a previous exercise. I decided to go with “pickMap: 0” so that users would see a satellite view. Using the coordinates for Stone Mountain, Georgia in MapView, I tested the theLatDelta and theLongDelta values, to see what the zoom would be and Flyover view.

The code in MapView for the saltellite view of Stone Mountain, Georgia.

I created a brand logo in Adobe Illustrator and developed a wetland inspired color palette to make the app visually appealing to paddling enthusiasts. The custom colors and font CSS make the app easy to read and navigate. I incorporated SF Symbols with custom colors and beautiful photography to give the app a clean, modern aesthetic while also evoking the outdoors.

I created custom code to incorporate the branded colors of Georgia Waters in the app design.

To take my app to the next level, I customized the background colors, navigation bar and lists to make the app feel like a bespoke experience. The background color of the app is a dark green to suggest nature and the outdoors. When you scroll through the lists, the background of the navigation title changes color to pale blue. I also changed the font so that it was smaller in size and displayed as inline text. By changing the .listRowInsets and background color to a gray-green.

RESULTS:

I enjoyed the challenge of creating a fun, informative and easy to use app to help paddlers find great places to get outside and enjoy nature in the Peach State. With so many apps featuring interactive maps, incorporating the MapView code was a game changer and helped take the app to the next level. Additionally, incorporating custom background colors, list formatting (including background colors, height and images), navigation bars and a logo; helped bring the app to life.

Georgia Waters app via an Apple iPad Air.

I tested the app on an Apple iPhone and iPad to ensure it was mobile responsive. While the list view does not feel as streamlined on an iPad, as it does on an iPhone at first. Once you select a destination from the list of options, it looks and functions great, especially the satellite map view due to its greater scale.

Overall, the Georgia Waters app offers great functionality and mobile responsiveness, while also being aesthetically beautiful.

Sources included in the app.