Inspiration

For a flash, the ‘deep sea’ seems to only whip up ideas of the terrifying unknown--a dark place filled with horrific creatures. Soon after, though, thinking of the ‘deep sea’ transports us back to high school. The time when learning that the ocean floor contains millions of human-produced, nearly invisible, and killer beads called microplastics lit the initial fire for us to engage in environmental petitions, city-wide protests, and even individual microplastic detection research. 
However, we now realize that focusing on the growing spread of microplastics disconnects us from its root cause: our unexplainable complacency and ignorance to the ocean, though it covers nearly 70% of our Earth. Now, nearly a third of all marine creatures are near extinction, including, unsurprisingly, deep-sea creatures. 
So, entering this project, our team’s leading question was: how can we both get people to care and contribute to the cause for our ocean’s life? Well, what makes parents who do not want dogs, love their dogs once they are home? What leads people to fight everyday for animals that some of us have never even heard of? 
Partnership. Feeling that that animal is not merely a title of a specific branch of the animal kingdom tree, but is something real--a ‘Pal’ of sorts. 

What it does

In comes ‘Sea Pal,’ a pet simulator merging virtual and real-life components for users to nurture an ‘affection bond’ with their sea creatures, aptly named ‘sea pals.’ This affection bond is tracked with levels and is affected by both components. 
The real-life component is the primary way to increase affection. It allows users to view both their own and nearby outdoor, arts and entertainment, or dining places’ locations. Once they are at one of the locations, they can ‘check-in’ to the location, opening up a chat room where they can talk to their very own sea pal! The real-life component provides additional features for ease-of-use, including a ‘check-in’ history log for the past week, the 3 closest locations to the user for a location category, and a view reset that centers back onto the user. 
The virtual components are the primary way that affection may decrease. For each sea pal, there are meters for happiness, exercise, hunger, and sleep that must be maintained. Each one has its own interactive, virtual method of increasing: petting the pal (happiness), playing a game swimming through the ocean (exercise), feeding the pal (hunger), and singing the pal a good night song (sleep). 
The sea pal’s profile is where the users can view their affection bond with the creature as well as customized blurbs on their relationship together and the users’ contributions so far; that is, an indicator, based on the users’ affection and time spent with their pals, of how much money has been donated to save sea creatures just like their own! 
The home page is where users can see daily deep sea facts, a short description of our donation system, and their pals, as well as create a new pal if they so wish. 

How we built it

The application was built entirely with React Native, requiring primarily Javascript, but also Objective-C to configure the iOS files for proper and optimal functioning. 
All components ‘speak’ to each other and dynamically keep track of each pal’s need meters and the actions that the user takes, increasing and decreasing the affection as needed.
The sea pals themselves are all designed using React Native’s animations and animatable components. 
The real-life component is our integration of the APIs and SDKs (configured for the iOS files) of Radar.io and Google Maps. Google Maps was used with custom map styling as a base for the displaying of the data points that were collected and parsed. These data points were all collected using Radar.io, employing a high amount of their features, including their iOS and React Native-integrated SDK to retrieve user location live, verifying accuracy of locations with their IP geocoding API, retrieving addresses with coordinates with their reverse geocoding API, and dynamic creation of geofences to provide a user-friendly ‘check-in’ functionality. 
The AI pals that users chat with are configured with their own personalities (the majority lean on the kind side) as they have been trained with sample user input and bot output conversations using Dialogflow. In real-time the program sends the user’s messages to the Google Cloud Dialogflow API, retrieves a response, and displays it back to the user. 
The ‘Exercise’ meter virtual component uses the react native game engine library to dynamically generate levels and fills up based on user’s performance in the minigame.

Challenges we ran into

Integrating Radar.io and Google Cloud (Maps, Dialogflow) APIs/SDKs required extensive planning into component division, considering potential repeated requests (which would result in lag) from overzealous state hook refreshes, creation of order in API/SDK requests as some components needed a request’s information before they could make their own requests, and configuration of keys for both the APIs and the SDKs (done in iOS separately). 
   Related to the previous paragraph, optimizing application performance considering the API/SDK usage of Radar.io and Google Cloud (Maps, Dialogflow) also presented a challenge. In the video demo, the application runs smoothly as optimizations were painstakingly completed by configuring component loading to be more distributed (e.g. do not load all at once, preload some, deload others), and, within that distribution, placing heavier API/SDK use on lower loading periods. 
   Configuring React Native libraries, as well as our API/SDK components to run smoothly (let alone function) on  iOS presented a challenge in terms of dealing with not only React Native/Javascript, but also  Xcode/Objective-C. Some of the most frequent issues encountered were components and features turning out to not be cross-platform, and react-native link installations incorrectly configuring on iOS files, requiring manual deletion and linking. 

Accomplishments that we're proud of

Though the project initially began with purely virtual components as a full-fledged typical pet simulator, we are extremely proud that we were able to push through and integrate real-life components into the game play in a natural and seamless way, creating a truly unique bonding experience for users. With check-in and chatting features, the sea pal comes to life with its own personality and, combining that with the time investment and real contributions that users make with their time spent, we believe a genuine bonding experience is awaiting our future users. 

What we learned

Though we had coded in Javascript before, it was our first times coding in Objective-C, integrating multiple APIs/SDKs into a project, and using the React Native framework, let alone doing mobile app development.
So in the short timespan of under 48 hours, we learned a lot about everything aforementioned, but also generally about application development and the ways that server-side features can be integrated to enhance user experience and mobile features. 

What's next for Sea Pals

Though the project began as a Hackathon submission, we have fallen in love with it. So we hope to begin beta testing the application with users after creating and integrating a database into our project to manage users and user data. With user feedback, we want to refine the application, focusing on the bond that the users develop with their sea pals, ensuring that the bond is as genuine as possible. 
To manage the donation aspect, we hope to eventually grow the application into a startup, beginning with pitches. One place we know for sure we want to pitch at is our university’s (Duke) very own Innovation Co-Lab, where lots of grants, advice, and more await on our journey to beginning a fully-fledged startup. 

Built With

Share this project:

Updates