Day 7: Design concept development #1

MasaKudamatsu
Building My Ideal Map App
3 min readMay 22, 2021

UI design is first and foremost about usability.

But it’s also about aesthetics, which can establish the brand image and also provide a pleasant feeling of using the app. An ugly user interface, however usable, won’t create a delightful user experience.

Graphic design, or any design, requires a solid design concept so its visual elements are consistent with each other. A design concept will be the guideline for every single design decision.

Every designer has their own way of developing a design concept. My own method starts with a mind map.

The first mind map I wrote for developing a design concept for My Ideal Map App

At the center is the app I’m going to create. Written down around it are the characteristics of the app such as:

  • Drop a pin
  • Tag places
  • Sift places by type
  • User’s own note on places
  • Show places around the user
  • Show places around the destination
  • Tightly linked to Google Maps features such as directions

This part is quite easy as I have written down user stories and the first sketches of UI design to implement these stories.

For each characteristic of the app, I then write down whatever associates it that comes into my mind. No judgement about whether it’s right or wrong at this stage. Getting ideas out is important at this early stage.

The defining characteristics of My Ideal Map App is to show the map around the user’s current location or their destination. Somehow this idea makes me imagine concentric circles, like the water ripple formed around the point where a stone is dropped on the water surface.

Photo by Pasieka

Another characteristic of My Ideal Map App is its effort to minimize the number of taps to implement a user story. It’s the biggest motivation behind it as Google Maps and Place.Guru require a lot of unnecessary taps to achieve what I want from them. This idea naturally leads me to minimalism, a design paradigm embraced by zen gardens, Apple and the likes.

A screenshot of Apple’s website (22 May, 2021)

Finally, My Ideal Map App is closely tied to Google Maps. The design paradigm embraced by Google Maps is Material Design. If the app’s UI is very different from Material Design, then the user will find it inconsistent about the close integration to Google Maps.

UI components of Material Design. Image source: material.io

From the characteristics of My Ideal Map App, we now have three visual concepts: concentric circles, minimalism, and Material Design.

Next step is to visually elaborate these three concepts, to find out what is common behind all. That connection will be a visual counterpart of My Ideal Map App.

--

--

MasaKudamatsu
Building My Ideal Map App

Self-taught web developer (currently in search of a job) whose portfolio is available at masakudamatsu.dev