When the app launches, users are greeted on the Login screen and invited to sign up or log in if they already have an account.
They can choose to sign in with email and password by tapping the "Sign in with email" button, which opens a screen to enter their email and continue.
Alternatively, users can sign in using Apple or Google by selecting the respective buttons, which redirect to the corresponding SSO login pages.
In the top-right corner, a "Continue as guest" button allows users to skip the process entirely and use the app as an Unregistered User.
Login Screen
BBP opens on a Map screen, which serves as the primary entry point to the application and provides
immediate access to its core content.
Upon launch, the map is centered on the user’s current position, allowing them to quickly
understand their surroundings and identify nearby destinations of interest.
Anchored at the bottom of the screen is a resizable sheet containing the search interface.
This sheet includes a search bar for querying destinations, along with a list of familiar
locations: Favourites, which the user has explicitly bookmarked for quick access, and
Recents, representing locations that were either previously searched for or recently visited.
Main Screen
In the top-right corner of the screen, a prominent action button allows users to contribute to
BBP’s database of Paths, encouraging active participation and content creation within the platform.
Add Path Menu (Automatic)
In the top-right corner of the screen, a prominent action button allows users to contribute to
BBP’s database of Paths, encouraging active participation and content creation within the platform.
Add Path Menu (Manual)
Tapping on the profile picture reveals the Profile section, where Users can see
the history of their Trips and the Paths they drafted and never published
Profile Screen
Tapping on the search field allows the User to enter the name of a location and access BBP’s
Path-finding capabilities.
As the User types, the app suggests possible destinations, combining a fuzzy search mechanism with additional
ranking criteria such as distance, relevance, and Path availability.
Search Destination
Selecting one of the suggested results centers the map on the corresponding location, allowing the
User to visually confirm that it matches their intended destination.
Search is not the only way to discover locations. Users may also freely explore the map using familiar
and intuitive gestures such as panning, pinch-to-zoom, and rotation.
Tapping on a location marker on the map selects it in the same way as choosing a search result.
Destination Preview
When Paths are requested, they are presented in a dual-view layout similar to the main screen.
The upper portion displays the Paths directly on the map, each rendered as a polyline and
labeled with a number indicating its relative ranking.
The lower portion presents the same Paths in a list, ordered according to the same ranking criteria.
The ranking is based on a score computed by BBP, which takes into account factors such as distance,
road conditions, the presence of obstacles, and other relevant parameters.
This score is implicit and not shown directly to the user; instead, it is reflected through
the ordering of the available options.
Paths Preview
From the Path selection screen, Users can choose any of the proposed Paths and start a Trip that
guides them to the selected destination.
BBP provides turn-by-turn navigaiton to safely guide Users along their route.
Since the application is intended to be used while the User is effectively driving a vehicle (i.e. riding a bike),
it adopts a minimal and distraction-free navigation interface.
The view focuses on the map and the currently followed Path, clearly highlighting the User's current position
and the streets to be ridden next, rather than displaying the entire route at once.
The map perspective automatically adapts to the current context, switching between a top-down view
and a street-level view depending on which is more effective at that moment.
Trip Recording
(Top view)
From the Path selection screen, Users can choose any of the proposed Paths and start a Trip that
guides them to the selected destination.
BBP provides turn-by-turn navigaiton to safely guide Users along their route.
Since the application is intended to be used while the User is effectively driving a vehicle (i.e. riding a bike),
it adopts a minimal and distraction-free navigation interface.
The view focuses on the map and the currently followed Path, clearly highlighting the User's current position
and the streets to be ridden next, rather than displaying the entire route at once.
The map perspective automatically adapts to the current context, switching between a top-down view
and a street-level view depending on which is more effective at that moment.
Trip Recording
(Street-level view)
When Users intend to add a new Path to BBP, they are presented with two available modes: Manual
and Automated.
In Manual mode, Users are required to enter the Path data themselves. BBP provides a dedicated screen
where users can either select a Path directly from the map, which can be expanded to full
screen for improved usability, or search for a street by name to locate it that way.
Manual Add Path Screen
When Users intend to add a new Path to BBP, they are presented with two available modes: Manual
and Automated.
In Manual mode, Users are required to enter the Path data themselves. BBP provides a dedicated screen
where users can either select a Path directly from the map, which can be expanded to full
screen for improved usability, or search for a street by name to locate it that way.
Search Street by name
Users are reminded that the info they submit is always reviewed and verified before being made available to everyone.
"A bike path can be either a dedicated cycling track or a low-traffic street where speed limits are compatible
with the average cycling speed.
Safety is our top priority at BBP. Please make sure the information you provide is accurate, and only report Paths
that truly exist and are safe to ride on.
All submitted data will be reviewed by our team and analyzed in anonymous form to ensure accuracy and safety."
Safety Info
Once a street is selected and deemed compatible (i.e., not already present in BBP’s database and
not marked as incompatible), BBP creates a draft Path and presents it to the User for completion.
At this stage, the User is asked to provide the remaining information, including additional details
about the street (such as whether cars or pedestrians are allowed), the Path’s road quality, selected
from a predefined set of options, and the presence of any Obstacles.
Path Draft
Users can pick between a set of a few options to determine the Path's quality.
Path State
Obstacle input is handled on a dedicated screen featuring a full-screen map.
Users can add Obstacle markers via a button and drag them to the correct location
along the highlighted Path
Add Obstacles
Tapping on an Obstacle marker allows the User to change its type, selected
from a predefined set of options.
Set Obstacle type
Once all information is entered, the user is returned to the Draft screen.
Pressing the save button in the toolbar prompts the user to choose between two options:
Save as Draft, which keeps the Path private, or Save and Publish,
which submits the Path for review and potential inclusion in the public database.
Add Path confirmation
If the user chooses Automated Mode, BBP begins a Trip recording session and presents the same
screen designed for use while riding.
The key difference is that no navigation instructions are provided, since the destination
is not predetermined. The map remains visible, however, to help the user maintain orientation during the recording.
Add Path
(Automatic recording)
