search

epiverse-connect / epiverse-map

MIT License
2 stars 0 forks source link

Design user interface #6

Open Bisaloo opened 4 months ago

Bisaloo commented 4 months ago

Pre-requisite to #1

chartgerink commented 1 week ago

[!NOTE] Cross post from https://github.com/epiverse-connect/epiverse-search/issues/13

I spent too much time thinking about the design structure, and in order to get myself off my ass I started a mock up. After discussing with @Bisaloo, search + map will be part of one micro-site.

You can view a very simple mock up, with interactivity on Penpot: https://design.penpot.app/#/view/f5fe9278-89db-81e9-8004-f9e8503e465d?page-id=f5fe9278-89db-81e9-8004-f9e8503e465e&section=interactions&index=0&share-id=1ab1fa36-da8e-809d-8004-f9f5c9a272e3

The grey square boxes underneath the "search bar" are placeholders for the WHO and data.org logo's. Here is also a recording, to make sure you see all the functionality I want you to see and provide your thoughts on:

https://github.com/user-attachments/assets/1ae69a89-cd73-427f-bf85-92c9f219ab94

What are your initial thoughts about the structure? I am sharing for early feedback and will also be able to demonstrate for our WHO meeting, if desired.

maguiNdong commented 1 week ago

The mockup is fine. It is clean and has a clear purpose (write what you want and see the results below). I don't care much about the logos, so I'll remove them now (we can find where to put them after). I guess there will be other flows, right? Could you please explain what the matrix means? (I'm sorry if it has already been explained; it seems familiar to me, but I just can't remember what it is)

chartgerink commented 1 week ago

Thanks @maguiNdong for the fast feedback 😊

Pardon the lack of context – here's some additions:

Regarding the flows, I am not sure what your thoughts are – this mock-up is certainly not complete in interactivity or information presented, it is more an example. The mock-up is made for mobile screen sizes but will also be adjusted for tablet + desktop screen sizes. There my thinking would be to have the search and the map presented horizontally next to each other as there is more space (in mobile they are presented vertically).