MS6 deliverable - ISIS-3510-Grupo-35/Application-Backend GitHub Wiki
Value proposal
Our app provides a convenient and efficient solution for campus parking by offering reserved spots for regular users, including students and faculty. Users benefit from guaranteed parking availability and the ability to plan their visit in advance, reducing the stress and time spent searching for parking. Additionally, parking lot owners gain targeted exposure through our platform, with advertising opportunities that enhance their visibility to potential customers. Author: Tomas Angel
Prototype
Important aspects of the UI/UX design
Color palette
We started by working with yellow and black, which are representative colors of parking lots in Bogotá. Later, we used the platform Coolors, which generates color palettes, and introduced the colors we wanted to include, letting it generate the rest. Finally, we conducted a contrast test between the background and foreground colors, ensuring that all the combinations we used passed the test.
Author: Ingrith Barbosa
Fonts
We used the Fontjoy platform to generate font combinations that we liked and found visually appealing for the app. We found the Poppins font, which we chose as the main one, incorporating it into the logo and the app's name. After generating several combinations, the one we liked the most was with Open Sans.
Author: Ingrith Barbosa
Icons and images
Within the Fontjoy platform, we found Brandmark.io, which creates the entire design around a brand. We provided the name, slogan, and a couple of keywords to generate the logo and the typography for the name. The one we liked the most was the one presented, to which we applied the chosen colors and fonts.
Author: Ingrith Barbosa
UI prototype
Author: Ingrith Barbosa and Tomas Angel
Navigational pattern
The navigation pattern consists mainly in the bottom tab bar with the icons which is a representation of the flat navigation pattern. The tab bar items or main capabilities are, the first icon resembles a pin to indicate where you are located, and by pressing this button you can see your reservation history with all the parking lots and the maps. The next icon is a magnifing glass, which works as a search view. In the search bar you can indicate the name of the parking lot or the name of the university you are going to visit, and it will show you options from that university or the parking lot you are looking for. The next icon is a heart, which will show you a list of your favorite parking lots which you yourself can safe for later use. Last but not least, there is the profile icon, which will show you important information on the user; whether he/she is a driver or a parking lot owner. In case the user is a parking lot owner, he can upload his parking lot to the app and specify the details of the different schedules he has and the pricing information. He can also transfer the money he has on the app to bank accounts elsewhere. For this course and the app, we will simulate the use of virtual currency, we will no operate with real money. Another navigation decision on the app is forward component, as we can se with the buttons when a person is going to reserve a parking spot, he will need to pay before hand and there will be a charge fee for the app usage, as well as the fee from the parking lot. This voiews requiere previous steps for completion therfore it is seen as a forward pattern. With this forward component the user also needs to return to the previous view, this means a reverse component also needs to be applied , to return one level upwards, for example if i want to check my previous entered data o if want to return to the iew of the map after making a reservation.
In case you want to see the prototype, you can access this link.