(This page is not publicly linked.)
The site generally looks clean and friendly :o)
I went through the first few steps of signing up as a nurse and I noticed some potential issues. I’m not a nurse (and haven’t been one), so I would definitely check my findings against actual usability tests with nurses, but these are more general UI notes.
Nurse registration flow
Everything was pretty straightforward until I got to this screen.
My reaction: Odd pause point. Am I done? It said this would only take 3 minutes and it’s been about 3 minutes so I should be done, but it tells me I’m about halfway done.
I guess I have no choice but to “Continue Building”. What’s the point of this screen?
Here is mainly where most of my confusion was introduced. Previously, I had only one path to go down. Suddenly it’s not so clear what I should do next.
There are 2 CTAs fighting for my attention. It feels like we’re guided through 48% of the task then let loose.
The checkmarks are confusing. My completed tasks are hidden, so you’re showing me my incomplete tasks, but they have checkmarks indicating to me they’re done. It’s not clear what’s an actionable link, what’s just text. What should I do next?
After analyzing the page, my interpretation is that StaffGarden wants the user to first complete their ePortfolio (starting with uploading their resume), then start browsing opportunities. Instead, the layout of the screen communicates “You should upload your resume – or maybe you should browse opportunities. You should also complete your ePortfolio but it’s not clear how.” – pulling the user in one direction then another.
For the most part, the mobile layouts are well thought out. Strangely, the “I am a Hospital” page displays very oddly on Chrome on my Samsung Galaxy S6 – way out of proportion.
For the nurse dashboard, I can see there was some thoughtful prioritization of what to hide so the interface isn’t so cluttered.
However… the signup checklist disappeared! From what I understand, it seems like the primary action you’d like the user to take.
Also, the spacing between every block is equal. The spacing between sections is the same as the spacing between a header and its body, making it difficult to distinguish one section from the next. That one’s an easy fix (see images below).
|Original spacing between blocks – headers look like they’re “floating”. Sections distinguished by color only.||Spacing between blocks fixed. Sections distinguished by color and spacing.|
Taking into account showing the user the next step, below is a layout that might work better – possible worth A/B testing. I’ve also altered some fonts and buttons to emphasize/de-emphasize the user’s recommended next action.
This is in no way my complete thought process or necessarily the work I’d do for StaffGarden (dependent on your needs), as this was mostly a UI analysis from someone who’s not your user. However, I hope you’ve found it useful and that you can see how serious I am about wanting to work with StaffGarden. :o)
For a representation of my UX process, see my portfolio at thefrankdesigns.com . Thanks!