Category: Sharon’s Status Reports

WORK ACCOMPLISHED:

Frontend Enhancements for Remote Control: This week, I finalized several UI elements on the remote control page, focusing on making the interface more interactive and user-friendly. Based on feedback from our demo, where users emphasized the importance of receiving immediate feedback that the board was operational, I modified the app to display the duty cycle instead of just speed. Additionally, I integrated a speed indicator to provide a more intuitive and responsive user experience, ensuring real-time visibility of the board’s performance metrics.

Motor Control Optimization: I finalized the motor control code, focusing on achieving a smooth and reliable speed curve. After iterative adjustments and testing, I optimized the speed rates for better responsiveness and stability. Additionally, I refined the emergency stop functionality to make it more effective and immediate, enhancing overall safety during operation. These changes ensure a more seamless and controlled user experience.

Integration of GPS Location Display: For the ‘Return to Me’ feature, I successfully connected the board’s GPS location to be displayed on the app. Following the pattern established with the socket-based acceleration controller, I set up sockets for GPS data transmission from the Raspberry Pi to the app. This implementation enables real-time location updates, represented by a pin on the app’s map interface. This progress ensures better visualization and understanding of the board’s current position, advancing the reliability of the ‘Return to Me’ feature.

PROGRESS:

NEXT WEEK’S DELIVERABLES:

• Link animations to the return sequence and ensure synchronized movement of the board with the app.
• Collaborate with teammates to finalize metrics and visualizations.
• Implement a centralized Bluetooth context to streamline connections and improve efficiency.

WORK ACCOMPLISHED:

Bluetooth Integration and Motor Control Setup:
This week, I focused on connecting the Raspberry Pi to the mobile app via Bluetooth to control the skateboard’s motors. One challenge was that many Bluetooth packages for Node.js were outdated and lacked community support. After extensive troubleshooting, I found a specific fork of the Bleno library that supported my requirements, allowing me to set up a functional BLE server on the Pi.

Initially, I attempted to call my teammates’ Python motor control scripts directly from the JavaScript BLE server. However, this approach was not seamless and introduced unnecessary delays. To optimize the workflow, I restructured the system by implementing sockets for motor control. The BLE server now forwards commands from the mobile app to the socket server, which listens on the same port and directly communicates with the motors. This solution reduced network overhead and significantly improved latency, creating a smoother and more responsive control experience.

Frontend Refinements:
I refined the app’s interface to enhance usability and safety. The emergency stop button now requires users to press it twice to prevent accidental activation, providing a crucial safety measure during operation. Additionally, I removed the reverse function from the control UI to simplify interactions, based on user feedback and testing insights.

GPS Accuracy Testing and Improvements:
Continuing work on the ‘Return to Me’ feature, I tested the phone’s GPS capabilities alongside the purchased GPS module. Outdoor testing showed an accuracy of up to 4 meters under favorable conditions. To improve results, I applied aggressive filtering techniques and implemented a Kalman filter to smooth out inconsistent data points. While this approach showed promise, testing was limited due to inclement weather, leaving room for further optimization. These efforts move us closer to reliable location tracking for the return feature.

Dependency Updates and Maintenance:
Maintaining the app involved updating several dependencies to ensure compatibility and stability. This task was critical to resolving issues introduced by outdated packages and improving the overall development environment.

PROGRESS:

The integration of the BLE server with socket-based motor controls marks a significant improvement in responsiveness and system efficiency. The updated frontend design prioritizes user safety while maintaining functionality, and the progress in GPS accuracy ensures we are on track for reliable navigation. These accomplishments strengthen the foundation for real-time control and navigation, aligning with our project timeline and goals.

NEXT WEEK’S DELIVERABLES:

• Finalize motor control testing to ensure seamless and reliable operation under various conditions and define acceleration/deceleration curve with teammates.
• Continue testing the Kalman filter and experiment with additional methods to enhance GPS precision, prioritizing outdoor trials when weather permits.
• Begin setting up WebSocket connections to allow continuous data streaming from the Pi to the app, enabling real-time monitoring and control.
• Connecting the GPS functionality and return to me feature from teammates.

WORK ACCOMPLISHED:

GPS Location Testing for ‘Return to Me’ Feature:
This week, I focused on refining the GPS location tracking for the ‘Return to Me’ feature, specifically testing the React Native geolocation library to assess its accuracy when integrated into the app. To establish a benchmark, I set the skateboard’s GPS as the ground truth. Through testing, I found that indoor accuracy was less reliable, especially when compared to the hardware data. Using the Apple longitude and latitude APIs revealed limitations in precision, even though they provided more digits in the coordinates. Outdoor testing yielded better results, with an accuracy of approximately 5 meters, and we are considering snapshotting the user’s location for the return feature. I will continue exploring methods to enhance GPS precision and conduct additional tests to ensure reliable navigation.

Bluetooth Backend Server Setup on Raspberry Pi:
In parallel, I worked on establishing a Bluetooth backend server on the Raspberry Pi to enable control from the mobile app. This process encountered several challenges, as many Bluetooth libraries were outdated, and only specific older Node.js versions supported Bluetooth socket functionality effectively. After troubleshooting compatibility issues, I successfully set up the server on the Pi. I also initiated connection testing between the app and Pi, allowing initial button presses on the app to trigger responses from the Pi. This setup aims to facilitate seamless control of the Raspberry Pi via the mobile app, enabling my teammates to shift from terminal-based commands to app-based control as they complete testing on individual components.

PROGRESS:

With enhanced GPS testing and a functional Bluetooth server setup, the app is progressively prepared for full control and navigation capabilities. Testing the React Native geolocation library provided valuable insights into the strengths and limitations of GPS tracking across different environments. The Bluetooth backend setup on the Raspberry Pi also establishes a foundational control link between the mobile app and hardware, simplifying interactions for further integration with the skateboard. These developments create a stable base for expanded real-time functionality and keep us aligned with the project timeline.

NEXT WEEK’S DELIVERABLES:

• Continue refining the GPS accuracy for the ‘Return to Me’ feature by implementing additional testing strategies to optimize location tracking, including snapshotting techniques.
• Collaborate with teammates to finalize control mechanisms over Bluetooth, refining button responses and commands on the app to ensure seamless interaction with the skateboard’s components.
• Begin exploring WebSocket integration for continuous data streaming from the Pi, allowing real-time feedback and control.
• Test the Bluetooth setup further by connecting more app functionality with Pi feedback, working closely with teammates as they conclude individual testing, aiming for complete app-based control by the end of the week.

WORK ACCOMPLISHED:

Backend Setup and API Integration: This week, my primary focus was on establishing a complete backend server setup that enables the mobile app to connect and communicate with the Raspberry Pi seamlessly. I developed API endpoints for essential commands and data exchanges, connecting these endpoints to the frontend to provide a responsive and cohesive interface. So basically defining more of the flow of the web app and how the commands to the skateboard will work. So now when you hit the button, it’ll send a HTTP request using Axios to the defined API endpoint which will also be on the Raspberry Pi server. Additionally, I set up a dedicated server on the Pi, allowing it to handle requests from the app efficiently. This backend foundation is a key milestone, as it allows for real-time control functionality and prepares the app for more complex interactions with the skateboard’s hardware. Once my teammates are ready and finished with their individual testing of the parts, we can connect the two systems so that when an action occurs on the frontend, it will go through the backend and function in real life. Also, defined that using Bluetooth the highest latency will be 100ms around so that’s good.

GPS Integration and Testing: I am currently testing GPS functionality using a React Native library, focusing on enhancing location accuracy for a smoother navigation experience. Configuring and testing various settings within the library allowed me to assess its performance under different conditions, aiming for precise location tracking. Permissions were set up on the frontend to streamline user access to GPS features, creating a user-friendly experience. Testing different configurations gave insights into optimal settings, which will improve the app’s navigation responsiveness. Also, looking into more of algorithms or signal smoother I can do to make it more accurate and seeing if I can get a longer and consistent stream of data in order to get a more accurate location on the phone.

Volume and Ringer Control Functionality: To enhance control options within the app, I also added functionality for the phone’s volume buttons and ringer, allowing users to control specific skateboard actions using these hardware features. I set up listener functions within the app to detect volume button presses, mapping these to skateboard controls, and adjusted the ringer settings to allow control sound feedback as needed. This additional control layer provides users with an intuitive way to manage interactions without relying solely on touchscreen inputs, especially useful in active scenarios where quick adjustments may be necessary.

---

PROGRESS:

With the backend server, GPS functionality, and volume control setup complete, the app is well-prepared for expanded interactions with the Raspberry Pi. The API endpoints and server setup on the Pi allow for smooth data and control flow, and the GPS implementation provides accurate location tracking. Testing the React Native GPS library was insightful, allowing me to fine-tune settings for maximum precision, while the volume and ringer control adds a valuable layer of user interaction. These accomplishments set up a stable platform for further real-time control developments, keeping us on track with the project timeline and hopefully allowing us more time to test when finish assembling the skateboard. I have set up this foundation so it would be easier and allow a smooth transition of integrating with the actual hardware in preparation for the completion of my teammate’s work.

---

NEXT WEEK’S DELIVERABLES:

Next week, I aim to complete the following:

• Finalize the testing of API endpoints for button controls, working with teammates to fine-tune parameters like acceleration and deceleration when they complete their individual testing.
• Once my teammates have been able to control their specific parts, I need to set up WebSockets and the backend on the Raspberry Pi to get the streamed data onto the app. I am waiting for them to see if they can get data from the hall sensors.
• Something we will work on is how the control of the remote will work on the volume buttons so will it be levels or more like a traditional remote controller where you can long hold the buttons.
• Continue working on the GPS coordinates of the phone and then be able to integrate with the LIDAR so we can start path planning.

WORK ACCOMPLISHED:

Bluetooth Functionality and Raspberry Pi Integration: This week, I focused on integrating Bluetooth functionality with the Raspberry Pi, which involved several setup challenges. Without an HDMI cable to connect the Pi to a monitor, I had to set it up headlessly, reimaging it with a specific network to enable SSH access. Once connected, I configured the Pi’s Bluetooth by enabling and testing it, then moved to set up Bluetooth on the mobile app. This required installing specific libraries and creating a BLE manager, which allowed the app to discover and connect to the Pi. Since Expo Go doesn’t support BLE, I had to split the native code for both Android and iOS, setting permissions accordingly.

On the Pi, I established a systemd service to automatically enable Bluetooth at boot, ensuring the Pi is always discoverable. After extensive testing, I successfully confirmed the app could reliably connect to the Pi. This milestone establishes a solid Bluetooth connection foundation, preparing us for future functionalities, including real-time controls.

Backend Preparation and Testing Setup: To prepare for backend integration, I continued organizing code for modularity and responsiveness, particularly for features that will connect to backend functionality. While full backend development remains pending, I focused on structuring the app’s Bluetooth connections and streamlined code for compatibility with the upcoming Raspberry Pi and mobile app control interfaces. I also started to make the API endpoints so that when my teammates are ready to connect everything system wise, they have an app to test with and connecting these two systems.

Raspberry Pi Setup: I worked on setting up the Raspberry Pi and making sure that the Github repository was on the Pi so that all my teammates can work on it without disrupting each other’s work and also be able to commit their work to Github from the Pi and so that there wouldn’t be any lost work and we are all able to see each other’s work on the Pi as well. I think something we could possibly setup is remote ssh on the Pi since only some team members need physical access to the Pi and others like me only need the remote capabilities of using the Pi to test software wise.

Code Refactoring: With this setup complete, the app is functionally ready for initial Bluetooth control testing, even though backend development is ongoing. I refined various elements across the app, particularly responsiveness and UI adjustments to enhance cross-device consistency. A systemd service ensures Bluetooth functionality on the Pi is seamless, and connection flows on the app are now stable. I also spent time refactoring code for future maintainability and responsiveness improvements.

---

PROGRESS:

Overall, I’m on track with Bluetooth integration, and the core Bluetooth connection functionality is operational. I overcame challenges with the headless Pi setup, expanding skills in network-based configurations and system services. While backend work has been delayed and I have been working on it still, foundational steps for future app and Pi interaction are complete, including BLE manager setup and systemd service automation. This enables us to move forward with Bluetooth-based features as scheduled in our Gantt chart. My next steps focus on backend setup and enhanced functionality for a polished user experience.

---

NEXT WEEK’S DELIVERABLES:

Next week, I aim to complete the following:

• Finish setting up the API endpoints for button control and defining the acceleration curve as well by speaking with my teammates.
• Once my teammates have been able to control their specific parts, I need to set up WebSockets and the backend on the Raspberry Pi to get the streamed data onto the app.
• There’s some things that still look a tiny bit off on different screen sizes so need to make more dynamic.
• Continue improving the visuals and animations for a more polished user experience.

WORK ACCOMPLISHED:

UI Layout Finalization and Enhanced User Experience:  

This week, I finalized the UI layout for all the key pages in the app, with a particular focus on setting up the connection flow. Now, users can seamlessly navigate through the process of pairing their skateboard, selecting devices, and managing connection success or failure.  The connection pages are fully designed and functional, including the welcome screen, device list, search, and both success and failure outcomes. For this, I just used mock data for now. I also added animations to enhance user interaction, making the overall experience smoother and more intuitive. With these components in place, the frontend is now in a solid state, ready for backend integration. The UI is responsive and visually polished, laying a strong foundation for future development. 

Additionally, I implemented a progress bar animation for the “Return to Me” feature, providing real-time feedback as the skateboard gets closer to the user. I also added a warning visual to alert the user if the skateboard is more than 5 meters away, enhancing the safety and usability of the feature.

Stats Page and Calculations: On the stats page, I calculated the equation for CO2 saved to provide users with meaningful feedback on the environmental impact of using the skateboard (the average passenger vehicle emits about 400 grams of CO2 per mile). This data is visually represented to engage users in tracking their sustainability contributions.

Remote Control Enhancements: The remote control page was improved with the addition of battery calculations and a corresponding visual to show real-time battery levels. I adjusted the battery percentage visuals to ensure accuracy and readability, which is critical for the user experience.

Responsive Design: To ensure the app looks good across different devices, I adjusted styles to be more responsive to various phone sizes. I also refined the tab bar styles, making navigation more user-friendly.

---

PROGRESS:

I’m on track with the progress made this week, particularly in finishing the entire UI/UX with animations, real-time feedback, and responsive design. The core layout for the remote control is complete, and I’ve laid the groundwork for future BLE integrations by refining the connection flows. Since I haven’t had the chance to work with the Raspberry Pi yet, it has pushed back my schedule for Bluetooth connectivity and integrating it with the mobile app. However, I have set up the proper libraries and will try testing it with mock data for now. Also, backend coding is still pushed but still debating the necessity for that. Also, for our gantt chart, we didn’t take into consideration that we had fall break and we were only going to complete additional tasks during that week if necessary. The schedule is below for my progress (my tasks are colored in orange and my shared tasks in yellow):

---

NEXT WEEK’S DELIVERABLES:

Next week, I aim to complete the following:

• Finish integrating BLE functionality and begin testing with the Raspberry Pi.
• Start coding the backend for the skateboard control interface.
• Continue improving the visuals and animations on the control and stats pages for a more polished user experience.
• Refactor code as needed to prepare for backend integration. Also, refactor the code to make it more reusable and responsive. There’s some things that still look a tiny bit off on different screen sizes.
• Test the GPS module on react native.

WORK ACCOMPLISHED:

Technology Decisions:  I decided to proceed with React Native for our mobile app, despite having to learn it, instead of using the Bluefy Browser, which offers BLE functionality but has limitations like no background running and requiring an additional app download. Although Bluefy would have been faster to implement, it posed too many unknowns and potential problems in the long run. React Native, on the other hand, has better BLE support, and though it involves some learning, it’s a well-documented and familiar technology for our team. I also debated using Flutter since it could offer more efficiency, but given my experience with React JS and TypeScript, React Native would be better and the advantage that Flutter offered was a higher efficiency of loading the app and its components.

GitHub Project Setup: This week, I set up the GitHub repository for our SkateBack project, creating an organized folder structure to manage the code. I also configured the necessary dependencies and environment for the project. I added a .gitignore file to exclude unnecessary files like node_modules/ and log files, ensuring the repository stays clean.

Project Environment Setup:  I researched the best tools and frameworks for our project and decided to use Expo for React Native, which eliminates the need to deal with both Android and iOS native configurations. I spent some time playing around with the Expo app example (still in the repo) to get familiar with its structure and capabilities. I also ensured all necessary tools, including Node, Watchman, CocoaPods, and the Xcode Simulator, were installed and configured, making sure all versions were compatible. I ran into a few compatibility issues that required specific versioning:

• Tailwind CSS had to be downgraded to version 3.3.2 for compatibility with Expo.
• TypeScript was adjusted to version ~5.3.3 to align with Expo’s requirements.
• Updated expo-module-scripts to resolve a missing tsconfig.base error.
• Had to use Node Version 20.

Initial UI Implementation:

I made progress coding the foundational UI components based on the Figma design:

• Finished the welcome screen for pairing.
• Created the initial layout for the remote control (without battery and gauge components).
• Developed the interactive map for the ‘Return to Me’ page, with distance calculations included and a recenter button.
• Completed the layout for the stats page with predefined values.

Parts List:

• Helped find some parts and submitted the ordering form!

---

PROGRESS:

With the GitHub setup and project architecture finalized, I am on track with the tasks outlined for this week. The UI layout is progressing well, and I’ve begun implementing key visual components, such as the interactive map, stats page, and control interface. I had to push back coding the backend a little more but will still be on target. The schedule is below for my progress (my tasks are colored in orange):

 

---

NEXT WEEK’S DELIVERABLES:

Next week, I aim to complete the following:

• Continue coding the remaining UI pages and components specifically finish the remote control. Also, need to make the rest of the connection pages as well.
• Refactor the code to make it more reusable especially for the coming pages.
• Start working on the backend and integrate functionality to the buttons.
• Hopefully, we can start integrating the BLE functionality and connecting the Raspberry Pi to the app since we are waiting for that part.

WORK ACCOMPLISHED:

Figma UI Design:

• Completed the UI design for the SkateBack web app, focusing on skateboard connection, control interface, and the real-time data display.
• Prototyped the design in Figma to visualize the app’s flow, making it easier for my teammates to understand how each component functions and how users will interact with the app.
• Incorporated feedback from my teammates to ensure the design is functional and user-friendly (Figma feature to make comments directly on the UI interface).

Parts List:

• Helped in finding more cost-effective alternatives for parts to save room in the project budget for additional purchases.
• Looked into the feasibility and cost of 3D printing components using our school ($0.48/g)–considering buying our own filament as a cheaper alternative.
  • For two trucks, it would be around 200g-300g ($96-$144).
  • Buying own filament and printing it ourselves costs around $0.03/g (>$6).

Discussions: We found that BLE isn’t supported on iOS devices to be able to connect the web app to the Raspberry Pi and we would need extra Bluetooth module hardware to do so, so we’re exploring two alternatives:

• React Native: Would support BLE but requires learning the language.
• Bluefy Browser: Offers BLE to connect Pi and webapp without extra hardware but doesn’t run in the background and requires an additional app download.

React Native is more integrated but slower to implement, while Bluefy is quicker but has limitations like no background functionality so we are still considering which option to go with.

---

PROGRESS:

I’m currently on schedule with the tasks for this week since the Figma UI mockup was finished and reviewed. As for the project environment, it was extended to next week when coding starts since we had some obstacles detailed above and had to mitigate. The schedule is below for my progress (my tasks are colored in orange):

 

---

NEXT WEEK’S DELIVERABLES:

Next week, I aim to complete the following:

• Set up the project environment, ensuring all necessary tools, libraries, and dependencies are properly configured
• Define the project architecture and establish the initial frontend of the web app, laying out the skeleton of the UI.
• Begin coding the UI components, focusing on building the visual elements like buttons, sliders, and real-time data displays, without implementing any functionality at this stage.

WORK ACCOMPLISHED:

Requirements Document: I compiled a comprehensive requirements document that outlines the functionalities for the skateboard control and real-time data components of the web app. I detailed the design, functionality, data sources, and any additional features for the following:

• Skateboard Control:
  • Designed buttons and sliders for Accelerate, Decelerate, Reverse, and Recall features.
  • Included considerations for visual feedback such as acceleration curves, braking indicators, and pathfinding warnings.
• Real-Time Data:
  • Designed the UI for battery life, speedometer, trip details, and environmental impact metrics.
  • Outlined how data is retrieved from hardware components like the Battery Management System, GPS, and motor encoder.
• Connection Page Design:
  • Created a section for connecting the skateboard to the app via Bluetooth/Wi-Fi, including a flow for scanning and selecting devices, displaying connection status, and offering auto-reconnect functionality.

UI Design:

• Started designing the mobile UI for the web app in Figma.
• Focused on mobile-first design since the app will be primarily used on phones.
• Began thinking about how to create a fluid design that works smoothly on mobile but doesn’t break on desktop screens.

Discussions:

• Talked to group members about having a simple backend server to store user data–keeping this optional for now.
• Discussed the feasibility of designing and laser cutting the CAD of a skateboard deck in terms of budgeting and if it is the most financially smart decision for us compared to buying a premade one.

---

PROGRESS:

I’m currently on schedule with the tasks for this week. The requirements gathering was completed within the expected timeframe, and I was able to start on the initial UI design to which I have a clear plan for the next steps, which will involve finishing and refining the design. The schedule is below for my progress (my tasks are colored in orange):

---

NEXT WEEK’S DELIVERABLES:

Next week, I aim to complete the following:

• Finalize the UI design for the mobile web app. I’ll refine the Figma design, adding more details and interactivity to better visualize the user experience. I will aim to make a prototype that we can use to see how the connections and flow of the web application will be.
• After completing the design, I will ask for feedback from team members and adjust the UI based on their suggestions to ensure usability and functionality.
• Set up the project environment for the web app. This will include configuring the development environment, installing necessary dependencies, and establishing version control.
• Start coding the frontend for the web app and creating the simple components and setting up all the pages as well.