This site is archived and may not contain up-to-date information. Return to current?
This website is not supported for your browser. Please download a modern browser such as Google Chrome or Mozilla Firefox, then refresh this page. Thank you!
Uguru Place Marker
One of the standalone projects I was assigned to was creating a map marker that would be used on the homepage and other pages with maps. The place marker would show where a Uguru tutor might be during their available hours, as well as what category they specialize in and a short personalized note.
Process
Profile Marker
The marker started out with a heavy focus on the tutor’s information. I drafted several iterations with different layouts, with an emphasis on modularity and interaction states.
Conversion to Place Marker
After some discussion with the team, we decided to shift the focus to the location rather than the tutor. The location was more important for immediate help, rather than a specific guru.
Mini Markers
The full place marker was too large for more than a few to fit comfortably on a map. I designed a mini version that, when hovered over, would transition to the full marker.
Matching the Place Marker
After deciding on the final format for the full place marker, I modified the mini marker to more closely resemble its larger counterpart.
I wanted the mini marker to look like it grows into the full marker, rather than two distinct components. The borders play a huge role in animating the marker.