Solar Voyages

Type: Website

|

2023


In November 2023, my friends and I participated in the NASA International Space App Challenges, which was a nice experience. We decided to take on the space travel agency challenge, for which we had to design an educative tool about space. We decided that the best way to make that tool fun would be to design and develop a website for a travel agency which would offer space trips. This is how Solar Voyages was born.

Design

Our goal was to build a full-stack website for this challenge. We had planned on using the Razor pages dotNet framework. We also wanted the website to look and feel realistic and professional. We ended up spending a few hours online (mostly on figma) studying travel agency websites and designing our website based on what we had found. We started by designing a mobile version, which came out looking more like a mobile app. We started with the mobile version because we had learned to develop mobile-first in our classes.

mobile home page
mobile planet information page
mobile payment page
mobile login page
mobile loading page
mobile cart page

We then proceeded to continue the design by working on the desktop version. Which ended up looking very different from the mobile version, pushing even more the idea that the mobile version should have been a mobile app. We ended up coming up with the following designs.

desktop home page
desktop planet information page
desktop login page
desktop cart page

Development

We ended up only having time to develop two pages of the desktop version of the website. While two of my teammates tried to set up the database with the framework. The rest of the team with myself got started on developing the front end. We ended up coding the two pages in HTML, CSS and JavaScript pure. We only had time to finish the main page and the sign in page. We also sadly ran out of time and did not get to program more. We also never got to set up the database.

If you were curious to see the code behind our two pages, you can find a zipped folder on our repo with the few files of code we wrote.

Final thoughts

Even though we never finished what we had planned originally, I think that we learned a lot through this hackathon. Firstly, I learned key concepts of design which greatly influenced the first version of my website and how I design my mobile apps now. I am also very proud of what we did. We received a lot of compliments from the mentors present that day about our code and how much we had achieved using no framework for our pages.

© Copyright 2024. Made by Gab Savard.