UI feedback

[guy_fraser]

I’m loving this theme, but there are a few UI/UX oddities I’ve noticed so far…

1. Enabled buttons are styled as if they are disabled

Because most form input buttons are so ‘faded’ (white bg, very light grey border and fairly light grey text) they look like they are disabled. At the very least they need darker text (#999?) and non-white background. It would be great if there was admin UI to set the colours of buttons. It would also be nice if ‘primary’ buttons, where applicable, could have different styling applied (eg. if there’s a Submit and Cancel button, the Submit button should be more prominently styled to make it more obvious which button to click in most cases).

Note: I know I can just add custom CSS, but IMHO it would be nice if there was UI to make buttons much easier to customise. I imagine a lot of sites will want button colours to reflect corporate branding, etc.

2. Transitions on mouse hover are a bit too slow

I love the subtle transitions when you hover the mouse over things, but wish they were a touch faster – possibly even twice as fast – as that would make the UI feel more responsive/reactive to my interactions with it.

Also, I noticed that there was no transition on drop-down list button hover.

3. What is “Base” and why is there a box around it?

In my profile, when I select the “Profile” icon, which is confusing in of itself, the contents of the “View” tab are enclosed in a box and there’s a most peculiar “Base” heading in it.

IMHO, the “Profile” icon should be renamed to “About” or “Details”; the box around the profile fields should be removed (what purpose does it serve?) and the “Base” heading should be either removed or renamed to something that makes sense. 🙂

4. Tooltips in main menu bar appear too fast

In most cases I don’t really want tooltips in the main menu bar as the item captions already say as much as I really want to say about them. There’s no way for me to turn tooltips off, so as I hover over main menu items I get an instant black tooltip reiterating the name of the menu item my mouse is over and it just seems very odd.

5. Weird submenu placement

When I hover over a menu that has a submenu, the submenu appears but with quite a big gap between it and the menu item my mouse is hovered over, making it feel very ‘detached’ from it’s parent menu item.

[Abe]

Thanks for posting this. We will analyze them and see what we can do

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.

[guy_fraser]

Item 5 on the list is the most important IMHO. Because of the gap between main menu bar and the submenus that appear when hovering over it, if someone is slow to move mouse down to the submenu it disappears before they reach it.

Also, I noticed that the search icon on the main menu isn’t right-aligned with the other content on the right-hand side of the page.

Both these things can be seen on the demo pages, eg: http://themeforest.net/item/kleo-next-level-premium-wordpress-theme/full_screen_preview/6776630

[Patagonia]

+1 for item 5. I had already posted this on the TF site as well as on the forum.

It is very easy to ‘lose’ the dropdown. Worse yet, if there is a mega-dropdown on the far right (which appear centered and not full-width), then it is nearly impossible to go to a subitem without triggering the dropdown of the item next to it (as you need o move diagonally and fast).

For a CMS like mine, the menu is othe single most important item of the site.
Thanks!

[troy14]

I would like a way to easily tell what color styling options correlate to the UI. I know that makes me sound new, but I am and I’m having quite a bit of issue picking and guessing via trial and error.

[guy_fraser]

@troy14 – if you’re using a browser like Google Chrome, you can right-click on any part of the page and choose “Inspect Element” – it will show you the HTML at that part of the page and even what styles are applied to it (eg. you can select a paragraph and in the sidebar it will tell you every single style applied and the CSS code used for it). http://cs.brown.edu/courses/cs132/resources/inspector/

If you’ve not done much with CSS before, there’s some good intros on how it works:

* http://www.w3schools.com/css/css_intro.asp
* http://www.htmldog.com/guides/css/beginner/
* http://www.csstutorial.net/css-intro/introductioncss-part1.php

[Hiro]

Ya, I’m with you on this. This is one thing I really dislike about this theme. The gap between the parent and submenus is frustrating to say the least. Hope they can fix it on a future update.

[SQadmin]

Hi guys, good news, we work to fix this gap issue between the parent and submenus right now and will be available with next version update(v1.4.3). Thank you for your waiting time.

Regards,
Robert

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[guy_fraser]

Awesome!

BTW, I very much like the UI design (not colours) of the SweetDate menus which I assume use similar HTML markup… 😉

Attachments:

You must be logged in to view attached files.

[Author]

Posts