Stride

• 

  Login Page

• 

  Home Page

• 

  Map Page

• 

  Leaderboard

• 

  Profile Page

Inspiration

After looking into our daily lives and schedules, our team realized that we needed an app that could encourage us to be more healthy and active. Many ICS majors and other students at UC Irvine too often neglect their physical health, which can be harmful in the long-term. We wanted to make this activity fun and engaging, motivating the UCI community to get outside. An interactive app that could benefit people resonated strongly, which lead to the idea of Stride!

What it does

Stride is a mobile app for iOS designed around being a simple yet effective way to track walks using geolocation and geospatial services. The home page gives users their daily steps and progress goals. The map page is an interactive map that follows your path and draws it out for users in real-time, along with tracking distance ran, calories burned, and current pace. The leaderboard allows users to compete with friends and see how well they are doing to encourage users to friendly competition. There is also a profile page to update settings and manage the account. Users are asked to login/create an account when first using the app.

How we built it

This app was designed around the react-native-maps library and API, which is a component of Expo Mapview. The UI and frontend was created through React Native and was simulated to represent any mobile phone through Expo. Our map component is built off Apple Maps, with location tracking from the phone's GPS data. We used Firebase for our backend database, which also hosts login and authentication for user accounts. This was useful to help us simplify and clean code. Additionally, we used a host of React, React Native, and Javascript libraries, including react-navigation, simplify-js, react-geolocation, and react-sensors. All of our code was written in VS Code and is stored on Github.

This was our requirements/planning document for this project.

Challenges we ran into

We ran into several challenges throughout the creation of this project, many of which revolved around dependency issues and package-not-found-errors. Some functions were deprecated entirely, others refused to cooperate with React Native, so at times we were glad to have Git in order to go back to previous commits that had stable versions. Making multiple features and having fluid frontend animations for each of them was also difficult. Getting accurate path tracking algorithms was challenging, but field testing and changing the significant digits of the GPS coordinates helped us. Other challenges included:

• Lack of clear documentation to draw paths on react-native-maps
• Firebase and react-native not cooperating with each other
• Tracking user paths indoors, requiring multiple long walks to fix
• Configuration troubleshooting
• Extensive codebase of frontend packages and node modules

Accomplishments that we're proud of

We are very proud of the app we have created and believe it is a modern project with practical applications that can benefit the UCI community. Some of our favorite accomplishments include:

• Creating a fun app that creates more student engagement and competition
• Using a modern UI that will attract a younger audience to the app
• Having precise geolocation that is consistent and real-time
• Managing a cloud backend to interface and connect to our app

What we learned

There are many errors and bugs that occurred, but utilizing resources such as documentation and mentors allowed us to overcome our struggles. We realized the importance of determination and perseverance throughout this project. Our team divided up work according to our strengths and often collaborated for harder steps, with a constant focus on communication and keeping our Github up to date. Some other items we learned include:

• Perfect GPS coordinates are extremely difficult indoors
• Not every piece of functionality can be perfected in 2 days
• Planning a tech-stack and requirements document early is vital!

What's next for Stride

We wish to make Stride available to users on the App Store for free downloading use. Adding more functionality and storing user run paths to see progress. A future update may also involve expanding to other universities and adding special rewards and avatars for the best runners.

Built With

• apple-maps
• firebase
• javascript
• npm
• react
• react-native
• visual-studio-code