barefoot-88
commented
2 years ago @MTG2000 Here is some QA feedback re: the implementation from our conversation in our Platform WIP call.
1. CTAs
For the time being, let's do the following for CTAs (e.g Write a Story, Submit an App)...
For Web: Can we move this CTA into the top navigation bar, as seen in the designs above? (Next to the avatar).
For mobile: i). Let's keep it where it is on the page itself (e.g Stories ✍️). If we decide we want to move it into the navigation menu later on, we can. Worth baring in mind the feedback of optimising the UX on web and discouraging writing a story, submitting an app etc on mobile due to it not being as enjoyable (e.g LinkedIn). I think moving a CTA to the menu would "hide" the action slightly, which might be optimal. But before we commit to a design change like this we can test it first/discuss more as a team.
ii). "Logout" CTA becomes an extra menu item on mobile (as seen in design), rather than a large CTA button.
2. Connect ⚡️
i). Can we move this "Connect ⚡️" button into the main nav bar on mobile (right hand side), as seen in the design? It makes it a bit more prominent.
ii). Without overcomplicating things, would it be possible to make this button on Mobile as unfilled (so just purple text)? And to keep the filled option on Web? I don't know if that's too complex... Just might seem odd to have a big filled purple button on mobile in the top nav bar.
3. Profile Dropdown Menu
i). This interaction works great on web, however I'm not so sure about mobile. Could we possibly remove it from mobile and implement the following...
a). If the user clicks on their Avatar, it takes them to their profile page b). The "Logout" option is moved to the main navigation menu as a list-item at the bottom c). Once we implement "Settings" as well, this can also be put as a list-item just above Logout
Please let me know if you have any questions?
Issue
During our Bitcoin Design crit from Bosch, he mentioned that the navigational components could use some attention in order to make navigation BOLT🔩FUN's website easier and intuitive. Some suggestions:
i. Improve language used in navigation. "Products" gave the impression of our own products, rather than an app directory. ii. Keeping things centred (as the screen goes from Large to XL, components get stretched full width and it could make sense to centre them. Keeping all page content within the Large grid size, and just stretching out the margins/gutters. iii. Login -> Connect iv. Mobile view is currently too cramped when the navigation menu is closed. v. Makers want to edit their profiles & access Settings faster.
Solutions
Here are a few ideas of how we can improve the navigation...
i. Change "Products" to "Apps" ii. As the screen size increases from Large to XL (>1440), the content should remain centred but the margins stretch.
iii. Already done ✅
iv. The following changes can be made to the mobile navigation menu:
v. Add a ⚙️ Settings option to the profile dropdown menu. This option will allow makers to access their "Edit Profile" state with one click. See issue #108