Mapping, Navigation, & Wayfinding
Mapping, Navigation, & Wayfinding is one of the key components of Phunware's Mobile as a Service (MaaS) platform . It is offered as a standalone SDK and also as a part of Phunware's venue solutions. As Director of Product Design, I worked with the Engineering and Product teams on every aspect of how this component works—everything from how the product fits into Phunware's broader offering, to the backend interface that allows the user to manage their venue, to the design details and constraints of POI icons.
We take a good look at each venue to create simple, concise maps that are easy to understand. Colors and elements are familiar and consistent across all venues and platforms.
Everyone Else's Location
Placing our custom maps on top of iOS & Android native maps helps to give the user context of where they are in a building, and where a building is in relation to the streets and city around them. They can zoom in as close as a single room, and zoom out as far as outer space. Using the OS's native maps also gives us acess to POIs outside of the building. This means the user can get detailed information on things around them and can route to and from outside Points of Interest. One of the biggest challenges we had to overcome was the translation of our own POIs to the map coordinates. Keeping the map in the correct position and scale while also keeping each individual POI in its position relative to everything else was no easy feat.
Points of Interest
POIs include any physical location within a venue. We created each POI to have metadata, such as images, text, floor information, etc. Users can select a POI from the client side app to view this information. They can also get directions to and from POIs within each venue.
Laying The Foundation
To create routes, the system must know all the possible ways a user can go. To do this, we lay a groundwork similar to how streets and intersections work. We devised an interface that makes it quick and easy to lay (sometimes) hundreds of segments. Once a user has selected the waypoint tool, all they need to do is click where they want a waypoint to be and it appears. Every click on the map results in a waypoint. To create segments between waypoints, a simple click on the first waypoint, and a second click on the ending waypoint creates the segment. If a user needs to change something, they can put the map into edit mode, allowing them to move and delete items. If waypoints are moved, the segments joining them will update once the user saves their changes.
Simple POI Management
Points of Interest often need all sorts of data types, such as rich media and text. We built an easy way for admin to manage all the POIs in their venue. The metadata that POIs get is fully customizable. Some standard pieces of data are: title, description, banner image (for the client side app), and POI icon. Our solution is a panel that slides in from the right and is used throughout various other products in Phuwnare's MaaS (Mobile as a Service).
Points Of Interest At Your Fingertips
Once POIs have been entered in the backend, and segments have been made, users can view them on the client side. Information such as metadata and photos are available for each POI. Users can choose to route between two points of interest and the client side app will show the user the steps to take to reach the end destination.
We built an out-of-the-box solution for venues. Customers can use this as their main mobile application, but they can also choose to customize it by using Phunware's Mobile CMS or engaging with Phunware's custom development team.
Details, As You Need Them
When users view a venue at a high level, too much detail on a map can be distracting. To account for this, we built multi-level zoom support into maps. As the user zooms in, more and more detail is shown, giving the user context to their surroundings. Multi-level zoom support required us to build separate maps for each level of zoom. Admin users can define the point at which each level appears on the client side via the backend portal interface.