[UX] Provide Focus State for Buttons, etc.

[amxmln]

Hi! This seemed like a very useful site/app from the moment I first saw it and now that I’ve had the chance to play around with it a little, that impression hase proven true. Thanks for making it!

Now the only thing that I think could use a little work is the user experience, most notably that it’s impossible to see which buttons / elements have focus when using tab to navigate the interface (for example when creating fields for a POST request).

In general, I feel like the UI could be streamlined and made more concise to make better use of space, but I get that this project is in its early days and that might not be the focus yet. Keep up the great work!

[liyasthomas]

Glad you liked it 💜
Improving UI/UX is a must. Keep suggesting your thoughts and we will consider them.

[amxmln]

Sure, here are some more thoughts:

• The request group is probably the most used group next to the response and request body groups, but the way the application is currently set up, it scrolls down after every request and then requires to scroll back up to change the request and send it again. How about putting the request options and the response field next to each other on displays of a sufficient size? And on mobile, where this option isn’t possible, perhaps at least the entire request group could become sticky when the view is scrolled down so it’s always reachable?
• It’s not very clear that the name of a group has to be clicked in order to expand it, perhaps the entire frame could be clickable, or there could be dedicated expand/collapse buttons?
• When clicking the Use button in the history, I would expect the entire request to be restored, i.e. including body and other fields
• This last one might be personal, but I feel the dark background in the dark theme is too dark and causes too harsh a contrast with the light text and the colors, maybe that could be brightened up a little, or it could be split up in a dark and a dimmed theme

I think that’s it for now (I haven’t been using the app a lot yet after all), but if something else comes up, I’ll try to tell you about those as well. 😊

Thanks for being open and recognising the importance of good UX!

[NBTX]

I'll get on these and submit a PR with a bunch of UI tweaks!

[liyasthomas]

Added few of of @amxmln suggestions

[liyasthomas]

Fixed with #130

[liyasthomas]

Hye guys.. @amxmln @NBTX @abraham @larouxn @izerozlu @yubathom @nickpalenchar @AndrewBastin @reefqi037
Check this out: Podcast about Postwoman: https://www.opensourcedevpod.com/episodes/postwoman-flying-through-the-network

[liyasthomas]

@amxmln Would you mind checking out the updated color schemes and give review?
Don't forgot to force refresh (Ctrl + Shift + R) and apply color schemes from Settings page.

[amxmln]

Hi, @liyasthomas, I had a quick look and it’s already much better.👍 Great work! I’m also happy about the new focus state for buttons, however, I think that the input and select fields would also benefit from one.

[NBTX]

@liyasthomas Sorry, I've been kinda swamped this week!
I checked out the new color scheme and it's 🔥! Though I think we're gonna need to put a bit more work into the light theme at some point.

...and I'm just listening to the podcast now.

[liyasthomas]

Major UI update is on the way 🔥
https://postwoman.io had a silly, non-professional UI.
It has been updated with better color schemes, icons and components.

Please review and give suggestions ✨

[liyasthomas]

Reached 100/100 Lighthouse score 🎉 🎉