WORK ACCOMPLISHED:
- 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).
- 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.