MS6: Optional Deliverable

---

Value Proposition:

SeneParking offers a revolutionary, smart parking solution tailored specifically for Universidad de los Andes, transforming the campus parking experience. At its core, the app leverages cutting-edge IoT technology to provide real-time parking spot detection, a feature that significantly reduces the time and frustration typically associated with finding a parking space. This real-time capability, combined with smart access through license plate recognition and in-app payments, creates a seamless, efficient parking process from arrival to departure.

What truly sets SeneParking apart is its user-centric approach. Unlike generic parking apps or traditional parking systems, SeneParking is designed with the unique needs of the university community in mind. It offers an integrated experience that includes spot reservation, navigation assistance, and accessibility support for users with electric cars. SeneParking's expandable design allows for future integration with nearby parking lots, potentially creating a broad parking network for the entire university area. By addressing the major pain points of campus parking - long waits, uncertainty, and time wastage - SeneParking not only improves parking efficiency but also significantly reduces stress, enhancing the overall campus experience. This holistic, data-driven approach to parking management represents a significant leap forward from existing solutions, positioning SeneParking as a valuable asset for Universidad de los Andes’ students, faculty, and staff.

---

UI/UX Design Aspects:

I. Color Palette and Rationale:

This color palette is great for SeneParking because it balances functional clarity with engaging, modern aesthetics:

• White (#ffffff): White creates a clean and open feel, ideal for backgrounds and spaces where users need to focus on information without distractions. It enhances readability and gives a fresh, modern look to the app.

• Silver (#afafaf): Silver works well for neutral elements like dividers, inactive buttons, or secondary information. It provides a subtle contrast against the white background without overpowering key content.

• Black (#000000): Black is essential for readability and emphasis. It's perfect for text, icons, and other key UI components, offering high contrast against lighter colors for easy navigation and legibility.

• Pigment Green (#01a63e): This vibrant green suggests safety, success, and action, making it ideal for indicating available parking spots, navigation directions, or positive interactions within the app.

• Folly (#ff3d63): This bold, eye-catching pink is great for drawing attention to critical alerts, notifications, or actions that require user focus, such as unavailable spots or warnings. Folly creates a subtle connection to Universidad de los Andes' brand identity by being a similar to the pink found on student IDs. This color choice helps grab users' attention and generates enthusiasm for using the app.

Together, this palette ensures a user-friendly experience by combining functional elements (black, white, silver) with vibrant highlights (green, folly) to guide users effectively while maintaining an energetic and modern design.

This color scheme aligns well with SeneParking's core values and objectives. The modern combination reflects the app's innovative approach to solving parking issues. The balanced palette creates a pleasant interface that appeals to a wide range of users, from tech-savvy students to older faculty members.

---

II. Fonts:

Designed by Christian Robertson, Roboto has, according to the Google Fonts website:
“a dual nature. It has a mechanical skeleton and the forms are largely geometric. At the same time, the font features friendly and open curves. While some grotesks distort their letterforms to force a rigid rhythm, Roboto doesn’t compromise, allowing letters to be settled into their natural width. This makes for a more natural reading rhythm more commonly found in humanist and serif types” (Google Fonts).

Roboto is a versatile, modern font known for its clean lines and readability, making it ideal for both digital and print applications. Originally designed for Android, it is optimized for screens, ensuring clarity even at small sizes. Its neutral, geometric design blends well with various styles, while its open curves and consistent letterforms make long passages easy to read. With multiple weights and styles available, Roboto offers flexibility for diverse design needs, and as a free, open-source font, it's widely accessible and supported across platforms.

This font shares a contemporary, tech-forward aesthetic that aligns well with SeneParking's innovative approach to solving parking issues. It provides a nice balance between impact and readability, crucial for a user-friendly parking app interface.

---

III. Icons and Images:

This icon set for SeneParking is designed with the needs of a smart parking app for the campus in mind. Each icon reflects the app’s core functionalities, including real-time parking updates, reservation, and payment features, while maintaining a consistent, minimalistic design. The use of dark blues, vibrant yellows, and greens reinforces the brand identity, providing users with a seamless, intuitive interface that aligns with the app’s mission to create a stress-free, efficient parking experience at Universidad de los Andes. Icons are provided in black as to review them but in the app they will have the representative colors. The icons are clear, modern, and user-friendly, ensuring quick comprehension and smooth navigation.

Link to the Figma Prototype

---

IV. UI Prototype:

You can visit this link in order to see the full prototype.

---

V. Navigational Patterns:

1. Start Page Navigation
   Pattern: Splash Screen
   Description: The user is greeted with the SeneParking logo and branding upon launching the app. It functions as a simple splash screen that transitions into the registration or login page.
   Purpose: This introduces the app's identity and provides a brief welcome. It's an entry point that leads to the core app features.

2. Registration Process
   Pattern: Linear Form Navigation
   Description: The registration screen features a linear form that requires users to input personal details like their first name, last name, email, phone number, date of birth, and university code. After completing the form, users tap an arrow button to proceed.
   Purpose: A straightforward flow where users are required to provide information in a structured, step-by-step format, easing them into the app's services.

3. Welcome Screen
   Pattern: Onboarding Screen with Call to Action
   Description: After registering, users are welcomed with a simple screen that explains what the app does and provides a call-to-action button ("Let's get parking!").
   Purpose: This serves as an onboarding screen that briefly introduces the core functionality of the app before leading users to the main screen.

4. Main Screen
   Pattern: Map-Based Home Screen with Quick Actions
   Description: The main screen is map-centric, showing available parking lots on a map interface. At the top, users can input their desired location using a search bar ("Where are you parking today?"). At the bottom, there is a navigation bar with four primary actions: Map, Services, Route, and Profile.
   Purpose: The map-based layout provides immediate access to parking information visually. The search function allows users to quickly locate parking, and the bottom bar provides easy navigation between key features.

5. Bottom Navigation Bar
   Pattern: Tab Navigation
   Description: The bottom navigation bar allows users to switch between core features (Map, Services, Route, Profile) without needing to return to a home screen.
   Purpose: This keeps the most frequently used functions easily accessible from anywhere in the app, reducing the number of steps needed to perform tasks.

6. Locating and Spot Search
   Pattern: Progress Indicator + Search Results
   Description: When the user searches for parking, a loading indicator (e.g., "Locating near me") is shown while the app finds parking spots. Results are displayed on the map with pin markers indicating available spots.
   Purpose: This provides real-time feedback to the user while the app searches for parking spots, ensuring the user knows their action is in progress.

7. Choosing a Parking Spot
   Pattern: Map with Interactive Markers
   Description: Users are presented with parking spot markers on the map. When a spot is selected, a detailed pop-up appears with information about the parking lot (e.g., location, distance, price, and vehicle type).
   Purpose: The interactive map allows users to visually find and select parking spots. The details pop-up provides the necessary information before confirming a choice.

8. Sliding Drawer for Profile & Options
   Pattern: Hamburger Menu Drawer
   Description: Users can open a side drawer from the main screen to access profile information, settings, reservation history, and help. This menu can be pulled from the left side.
   Purpose: It offers easy access to secondary app features, keeping the main interface focused on core functions like parking search and reservations.

9. Spot Reservation Flow
   Pattern: Stepper for Reservation Confirmation
   Description: Once a user selects a spot, they are guided through a confirmation process, which includes reserving the spot, getting directions, or paying online.
   Purpose: The step-by-step process ensures that users don’t skip any steps and provides options for spot confirmation, payment, or navigation.

10. Waiting Time for Reserved Spot
    Pattern: Progress Indicator with Timer
    Description: After reserving a parking spot, the user is shown a waiting screen that displays the time remaining for the reservation, alongside a "Report a problem" button.
    Purpose: