MS6 - ISIS3510-202620-Team41/ISIS3510-202620-Team41-WIKI GitHub Wiki

Microsprint 6 - Week 06/09/2026 - 12/09/2026

1. Value Proposal

University students using our app want to make the most of gaps in their schedules whether to grab a bite, hang out with friends, or engage in an activity. Currently, this goal is often thwarted: they lack information on nearby options and the time required for each; coordinating schedules via WhatsApp with multiple people is slow and wastes precious free time; and waiting in line for food eats up even more of their limited break. What they want is simply to use that time effectively, discover new activities and dining spots including deals and promotions tailored to their preferences and coordinate more easily with their friends. We solve this with a shared calendar that automatically cross-references the user's schedule with their friends'; a catalog of activities and restaurants filterable by key criteria, with relevant ads and offers from local businesses seamlessly woven in; and to-go orders that can be placed in advance for ready-to-pickup service. This eliminates the uncertainty of not knowing what to do, replaces manual coordination with automatic schedule matching, and resolves dining hassles while adding value through curated recommendations and exclusive promotions. Ultimately, it helps students make the most of every schedule gap by showing them in seconds what to do, where to eat, and who to join, all without wasting time on coordination or waiting in lines while local businesses gain a direct channel to reach students exactly when they're most receptive.

2.1 Colour palette

We chose these colors for our app because each one represents something we want to communicate while also having a specific purpose within the interface:

  • Blue (#89CFE0): We use it because it represents trust, calmness, and security, we want users to feel that the app is a safe space to find and share activities.
  • Rosewood (#C90956): It is related to emotions, sensitivity, and relationships, which fits the social side of the app since we want users to connect and do activities with other people.
  • Yellow (#FDCA64): According to color psychology, it is associated with optimism, happiness, and energy, we chose it because we want using free time to feel fun and positive.
  • Green (#01A74C): We mainly use it to indicate confirmations and active states, such as when an activity is confirmed or a user is available/active.
  • White (#FFFFFF): We use it mainly for the background, as it helps keep the interface clean, simple, and easy to read.
  • Black (#000000): We mainly use it for text, since it provides good contrast with the white background and makes the content easier to read.

2.2 Fonts

The main font used in the application is ABeeZee, because it's rounded and friendly style fits the social and casual nature of the app. It makes the interface feel approachable and fun, while remaining easy to read on a mobile screen. This is especially important for students who need to quickly check activities and places during short breaks between classes.

2.3 Iconography & Imagery

Icon Style

The app uses simple line icons with thin strokes and rounded corners. All icons share the same size and stroke weight, which keeps the interface organized and prevents any single icon from standing out without reason. The rounded style matches the cards and buttons, giving the app a friendly, approachable identity.

Navigation

The bottom bar has four icons with labels underneath, a house for the main screen, a group of people for friends, a clock for activities, and a silhouette for the profile. Even though the symbols are familiar, labels were added so there's no doubt about their function. The active section is marked in magenta, so users always know where they are. A clock was chosen for activities because available time is the core theme of the app.

Action Icons

The magnifying glass sits inside the search field, and the filter icon is kept separate so the two functions don't get mixed up. The floating magenta "+" button creates a new activity, it's one of the app's main action, so it gets the boldest color and a fixed position. There's also a back arrow, a paper plane to invite friends, a pencil to edit, and a share icon to send the plan to others.

Category Icons

When choosing an activity type, icons are used for food, games, music, study, crafts, sports, cultural, and rest. This are used here because users need to tell them apart quickly within the grid. The selected category fills with magenta to confirm the choice.

Informational Icons

Cards include small icons alongside key data like a pin for distance, a clock for duration, a price symbol for budget, and a person for the number of participants. This packs a lot of information into a small space and lets users compare options at a glance.

States & Confirmations

A green dot on an avatar indicates that a friend is available. The green tag signals that the activity fits within the user's free time one of the most important elements in the interface, since it answers the app's central question. When a plan is created, a green check confirms everything went through. Green always means something positive, available, or confirmed.

Photography

Photos are real, clear, and well lit. Photography was chosen over illustration to build trust and for deliver a better experiencie to the users will physically go to these places, so the image needs to show what they'll actually find. Photos sit at the top of each card, with tags in the corners so they don't cover the image. The final screen uses a large photo with a dark gradient at the bottom so the venue name stays readable.

What We Want to Communicate

Everything is designed so users can decide quickly, because their free time is short. Real photos and a consistent design make the app feel reliable. And the rounded shapes combined with magenta give it a young, energetic ident that connect with all the young students that will use the app.

2.4 UI Prototype

The interface takes inspiration from a Flat Design approach with influences from Material Desing, in which we proritize simplicity and usability while giving subtle Depth to distinguish interactive elements and content sections. The design uses cards to separate sections in order to scan more easily the information while using spacing and negative space to prevent the interface from feeling crowded.

In the next link you can interact with the prototype

https://crane-denim-13303364.figma.site

AI tools were used during the prototyping process to transform our initial low-fidelity wireframes into a higher-fidelity visual prototype. The wireframes, user flows, functionality, and design requirements were defined by the team. AI was used primarily to assist with the visual implementation and refinement of these designs. The resulting prototype was reviewed and adjusted by the team to ensure that it remained consistent with our intended user experience and design decisions.

2.5 Navigational Patterns

We use these patterns to keep navigations within the application simple and reduce the number of interactions needed to find or organize an activity, since users normally interact with the app during limited time windows (their gaps).

2.5.1 Flat navigation for the main sections

The app uses a flat/lateral navigation for its primary destinations (Home, Amigos, Actividades and Perfil) since they are peer sections that the user will need to access more frequently.

2.5.2 Hierarchical navigation inside each section

Once the user is in of the main areas of the app, the app becomes hierarchical. For example, from Home the user can select a recommended activity and acccess its detailed view.

2.5.3 Forward navigation for creating an activity

The app has a forward navigation for creating an activity with clear and intuitive sequential instructions as shown with the example of the flow in creating an activity.

2.5.4 Reverse/upward navigation

The app uses reverse/upward navigation, it allows the user to the previous level or previous step without forcing them to restart the task.