UI Redesign from the Ground Up

[astoko]

Hello Everyone!! :P

I came around looking in OM just because i was looking for alternatives and i quite like it, though i think the design is kinda reminisant of the 2016-ish or a bit more modern than that UI.. i personally like circles and uniform ui that works and looks nice.. though i might as well say that i dont have the greatest taste and i do UI as a hobby but here down bellow is my own opinion of how it should look.. you could say as an rebrand lmao XD.

Simpler Indicators and Color Palate

I took an look at the app and it seems the color palate as well as the icons are.. not feel the same and kinda thought that maybe that could go for a change, Using the Google Icons Library with the parameters of Weight:600, Fill, Grade:Emphasis, 40dp i made an example icons..

Changed the Logo & Font and Color Palate.

This might be controversial but i think that an application dedicated for mobile use should use an simple logo or something that at least can be reminiscent of the original.. thought i am NOT an logo guy i would love an redesign of the logo just to see what people think and maybe some new ideas that have more creativity than my logo hehe idea.. as it is just an icon with maps pointer on... maybe a leaf that was pointing downwards would be cool?

Grand Finale: UI Redesign

Now the idea was to streamline the whole process as it looks smooth as possible.
I tried but really i was kinda sleep deprived when i made these so i just want an opinion and a thought of if its needed to update the UI? Also i tried to keep everything more or less the same in uniform with sizing and colors.. but i might have done mishaps that i haven't seen, feel free to form an constructive argument of how do you think it should look and if you would like please include examples!! :3

Design Library

Design Mockups

I might not know how to do any developer work but..

I just wanted to give out my opinion and that is what i love about open source so here :P
Also if you find again something wrong or just blantantly amazingly wrong too then yk.. say it ;3
And yes its clearly based on Gmaps and i just wanted to put my own spin on it hehe.

Disclamer i am not really an dev but just do passion projects for fun and mayhaps give out unpopular opinion and yes there is some placeholder icons that dont make sense.. sowwy too eepy qwq .

[astoko]

I am pretty sure most of this or all will and cant be migrated but i just thought as an thought experiment and having new ideas would not hurt :P

[VoxelPrismatic]

Looks cute, but I prefer our existing logo. Has more of a community feel behind it, whereas the one in your mockup is extremely corporate.

[astoko]

Looks cute, but I prefer our existing logo. Has more of a community feel behind it, whereas the one in your mockup is extremely corporate.

Yeah i know i am not really good at design at logos so.. it was just an idea hehe ;P

[fitojb]

The typography and color palette are exquisite! Congrats!

[VoxelPrismatic]

Grape

[VoxelPrismatic]

Actually, I really like the idea of naming all the colors after fruit.

Light Green - Apple
Dark Green - Avocado
Orange - Orange
Light Red - Strawberry
Dark Red - Tomato
Blue - Blueberry
Purple - Grape

I also am really into yellow. Can you make a couple mockups with lemon yellow?

[astoko]

Hmm Let me see what i come up with, though yellow is an relatively pretty hard to the eyes color i will see what i can do, for now i was thinking more of finishing the transportation UI and doing an little cleanup to my UI Library so it is easier for me and others to continue on forward.

also in an unrelated note i just reinstalled my arch linux install and trying to make everything again up to where it was and want to keep it minimal so it will take me a just a bit more of time than usual :3

[VoxelPrismatic]

"BTW"

[astoko]

"BTW"

I had to xD

[ArtjomSchwenk]

Wow I just came by to look for any discussions regarding an UI-Overhaul and here you are blessing us with this. This looks really good. It feels very modern and I like the bold design. Recommending OM to my friends will get way easier, even if just a bit of your design makes it to release. I would even volunteer to help implementing it 👀

[astoko]

Thanks for the compliment and I'm happy you like the overhaul suggested interface. I honestly think that OM kinda needs a solid and straightforward design guideline as it kinda all feels up in the air.. Yk?

[astoko]

Also I was thinking of making the transportation UI different from what other apps use as idk.. Just thought maybe it would be cool.. I might start on that and see how it goes :3

[astoko]

UI Transportation Progress:

Just an little UI element that will be used when selecting the route in a list of options.

[Petak73]

This definitely looks nicer but at the same time makes OM look like pretty much any other nav app. The current look is a bit rudimentary, but it does distinguish it from the crop. I don't know ...

[astoko]

I get the idea and I've tried multiple failed times to keep looks and identity good and different but I mostly took inspiration from the highly successful project called immich that kinda based itself on the same interface idea as G-photos and still made adoption easy with a privacy minded approach.

Though I'd be nice if someone made a more identifiable UI to see how it goes.

[VoxelPrismatic]

I guess the tough part is that there's not a lot of UI in a mapping app.

• The map
• A few text boxes telling you where to go

Certainly, removing the 3D map like what you've shown will make it unrecognizable. It's actually one reason I love OM.

As for the other stuff, it could use an upgrade to the modern UI library, but it's not strictly necessary.

[astoko]

Actually I wanted to make it 3D but the amount of tinkering in Figma needed to do that goes up really fast really quickly.. Sorry for the confusion qwq

[patepelo]

@organicmaps/design

Interesting proposals. Thank you for taking the time, you're very talented, @astoko

[PinguDEV-original]

To be honest, I'd really like this. But I have two points to criticize:

1. I like the current OMaps logo and I think it should not be changed too much and doesnt have to. Maybe simplify it a bit, but such a big change as shown in the first post.
2. I would like to see as much detail on the map as right now. Maybe with different colors, yes, but without the crazy good detail I think it will loose some users (my dad for example loves OrganicMaps for the design of the map and the great detail)