https://www.figma.com/embed?embed_host=notion&url=https%3A%2F%2Fwww.figma.com%2Ffile%2FwZWLGHdMMEQzDNilVtgVLk%2Fspott-Design-Work%3Fnode-id%3D2%253A9651

👈 Click here to view my screens on Figma

I was given three user problems to solve:

User Problem #1

When a user spotts, they want to be able to do so in a less public way so other users who they might not know are not able to see all of their posts and locations.

Currently, spott has one large public map where the user can view everyone's posts and locations around the world, even if they are not following them.

Even if two users follow each other, there is a chance they don't know each other personally, rather, they know of each other through mutuals.

I was asked to design a feature called maps to give more privacy and comfort to a user and encourage more spotting.

They are essentially private maps for users to create and spott in, similar to group chats or private stories. I was given a list of functionalities that the feature must include, and I designed mockups from there.

I designed several iterations of mockups for each part of the feature. After multiple critiques and suggestions from the spott team, I created the final designs for private maps:

Spotting Into a Map

spotting_into_map.mov

spotting into map.png

The user creates their spott and clicks the "spott to" button. This leads them to a list of maps (including the public map) from which they can choose where to post their spott.

Creating a Map

Prototype made on Figma

Prototype made on Figma

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/36406aa5-6564-4b09-9758-49ffd321d2c2/Screen_Shot_2021-06-15_at_10.06.40_AM.png

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/68e26b17-990d-4214-999b-e1176d9e55bb/Screen_Shot_2021-06-15_at_10.09.57_AM.png

The "create a map" button is accessible in two places once the user types in their spott - top right corner and the last cell of the map list. The user can add members either from the categorized list or they can copy a link to their clipboard to manually send an invite to a friend. The last step is to input map details, and there is an option to easily remove someone they added.