×


Sitemap

Sitemap engages users with local architecture through a location-based architectural map and integrated camera. Users can explore and document buildings and reach out to the Sitemap community for more information through photo-based detail requests.

Where do I go,
and how do I show?

The first step in developing Sitemap was to create a user survey to understand what devices users typically had with them while exploring a city, and how they used these devices in terms of alerts, navigation and photography.

In addition to this basic data collection, the understanding of two specific user behaviors helped to begin the framework for Sitemap: Decision Making (Where do I go?) and Social Media Behavior (How do I show?). Users predominantly used two methods for deciding where to visit; advance research and discovery through wandering. Sitemap needed to allow users to employ both of these methods by providing a location based map and a search feature for future travels. In terms of social media, users favored sharing images of visited locations over “checking in” to specific locations. Sitemap needed to focus on a more visual check-in and allow for users to share their photos to a larger community.

The Architect
& The Wanderer

User Personas were developed with two potential users; one with a design background (The Architect) and one without (The Wanderer). This discussion helped to understand how Sitemap could be beneficial to a broader audience than the architecture community.

If you spend too much time planning a trip around architecture, you miss the spaces in between.

Neha G.

THE ARCHITECT

Neha loves exploring architecture and taking the time to sketch whenever possible. Trained as an architect, Neha is constantly on the lookout for new architecture to visit, but doesn’t necessarily like to plan trips around a specific list of buildings. When researching cities in advance of visiting, the list of buildings to see can get very lengthy and daunting, so Neha would like a way to create a reasonable list to visit, but would also like to see if there are interesting buildings in the area at any given point.

GOALS

Constantly using a map while travelling is boring - exploring and experiencing is the way to go.

Sean G.

THE WANDERER

Sean likes to travel to new cities and explore by wandering and stumbling across interesting places. Though he does use Google Maps as a primary navigation source, he prefers not to use them while walking around, as he feels that it drains his battery and also takes away from the experience a bit. Though he does prefer to discover, there are times when he would like to see if there are any interesting points of interest around him, especially when his current location doesn’t have much to offer. Though his background is not in desing, he is interested in learning unique facts about buildings.

GOALS

As a user,
I want to...

After collecting the user data, several user stories were developed to create an effective MVP. Fast sketching and a low fidelity mockup charted these stories to understand how all primary functions could be accessed from the home screen/architectural map.

Why not just use Instagram?

Though the user stories and early prototyping seemed to provide a solid foundation for a successful MVP, a single question loomed: Why wouldn’t a user just use Instagram? The architectural map was unique, but was it enough to engage users?

In order to answer this question, a group of architects was gathered to discuss how Sitemap could be unique to architects/designers and also encourage non-designers to become engaged with architecture. Though many ideas were discussed, the primary feature that was included in the MVP was the Detail Request. This feature would allow users to tag a photo with a question about a specific area. As a part of the building album, other Sitemap users can browse and reply to requests. Both architects and non-architects can use it as a forum to learn about topics ranging from architectural styles to a connection detail.

FUTURE RELEASE FEATURES



Identity

Much like the functionality, the identity of Sitemap needed to be unique and understood by all. Sitemap’s mark is based on two of the major functions of Sitemap: navigation and documentation. Concentric circles form a letter "S" and are connected by a “walking path.” This mark can also act as a camera aperture, allowing for flexibility of background imagery in different use scenarios. This form also helped shape the location indicators used within the application.

The color palette and typography were carefully selected to make Sitemap both legible and unique. A high-contrast dark palette was developed for the map itself, differentiating itself from typical map applications and making it easier for the user to identify their location and the surrounding buildings.

Quicksand was chosen for Sitemap for it's legibility and architectural qualities. Titles and headings utilize uppercase styling for quick legibility, while detail requests use typical sentence case to feel conversational and friendly.

Ready to Launch

After developing a cohesive identity and navigation, high fidelity mockups were produced in Sketch and prototyped in Invision. Further prototyping was developed in Flinto to understand how transitions and animations could enhance user understanding while making the interface more visually engaging.

1. Onboarding Process

The minimal onboarding screens allow the user to quickly Sign Up, Sign In or Reset Password. After an initial login, Sitemap would immediately open to the Architectural Map unless the user signs out.

2. Architectural Map

The Architectural Map acts as the “homepage” of Sitemap, and all features can be easily accessed from this screen. The map clearly indicates architectural highlights in the area, and users can tap on a building to access a preview with basic functions. Nearby buildings can also be viewed in a list format.

3. Navigation

Users can get detailed walking directions to the building, which can be viewed in the Architectural Map or in a list format.

4. Detail Requests

After taking a photo with the in-app camera, users can add a Detail Request to a photo which can then be viewed and answered by the Sitemap community.

5. Albums

From the Architectural Map, users can access and search their personal Building Albums and Detail Requests.

6. Search

Users are able to search buildings and additional locations from the Architectural Map.

7. Settings

Users can update their Architectural Preferences to expand or narrow the buildings in their area.