Our group is called Reboot Rebels but we've designed the web app as a reflection of our own pod name, Cyber Sapiens. To provide an immersive feel, a video of a humanoid figure on the homepage greets visitors. Alongside a sleek and minimalistic design, the theme across the website is futuristic as reflected by the fonts and colour schemes.
Please find below a summary of some of the key features of our site:
We have included details about who we are, what we do, where we study, and what we like to do in our spare time for those who would like to learn more about us
We have also included an interactive map of places around the world that we've visited so that you can see where we’ve been!
We built the website using Flask for the backend, HTML/CSS for the frontend and JSON data files as well as pulling Google Maps API data. We collaborated over Github and discord to communicate and review each other’s commits to approve pull requests.
Planning for a responsive site design was a challenge, as we had to think about how to optimize the code and make sure that everything would work on all screen sizes.
We had to focus on the layout and make sure that it looked appealing to different user personas, rather than just showing off our work. It was important to keep in mind that we want other pod members to see our progress within this project and make it scalable to build upon in the future.
Rendering the Google Maps Interactive Layout
Creating a fully functional full-stack web application using flask despite the short timeframe
Applying all expected Git/Github best practices in a constructive and collaborative manner
🛠️ Backend Creating a file structure that works with the Jinja2 template engine
Using template inheritance to share data across multiple web pages
Rendering web pages and sharing json data through flask for use within templates
Pulling data from the Google Maps API
Wireframing and prototyping using Figma.
Designing a cohesive, consistent and functional UI/UX.
Utilising a Git collaboration workflow
Creating issues to track tasks that require work
Developing each feature in a corresponding branch
Implementing a code review process to commit work, and get feedback from project members
Implement more template inheritance throughout the website
Add more functionality to our web apps with a database rather than JSON data files (Added IDs within current data files to make migration easier within a db schema)
Add accessibility features to the web app while maintaining good design principles
css flask html javascript python