Not quite feeling it yet, but definitely heading in the right direction...
If you have any other ideas, I've attached the PSD for you to have a play with (including a few other ideas).
over 2 years ago
Proud of you. Its coming along nicely, not too sure about the top progress bar. My least favourite of the four. I like the second but feel the numbers look a bit out of place.
I second that from Karl re the 2nd bar being the best of the lot. How would it look without the 3 and 4 numbers, just greyed out circles?
Second on the left for me, too.
And I like the numbers. They reinforce the interdependences of the process.
I like all of them, nothing wrong with the first, just different from the others.
Assuming more info is accessible by clicking the nodes, could the bottom left be used as a hover state for the second node of middle left?
Heck, you could keep the numbers hidden in the remaining nodes until hovered, too.
Nice work Jesse.
+1 for the first, it has clean and straightforward presentation, but maybe with number 4's progress bar end.
p.s : I think I'm gonna steal this.
3rd one looks like you should be able to drag the indicator from one stage to the next. I like the 2nd one.
I'd go with the 3rd option and inverse the current step. Green icon on white bulb that is.
I really think the second one is perfect. Wouldn't change a pixel.
The second is the best imo :) anyways looking very nice
Another vote for the second.
Interesting... when you reach the 'Delivery' marker are you actually done or 'almost' done, if I remember correctly you'd still have to pick to 'deliver now' or 'schedule for delivery' and also pay if you have no credits. In other words... do you need another step after delivery to best convey how much is left to be done?
I'm just thinking that otherwise you will end up with a scenario where the bar is complete but you still have some steps to work through.
I'm leaning towards the middle one on the right in your "spectrum.png" attachment. To mean it combines all of the best parts: shows what's been completed, your progress with the green line, maintains the "2" for the 2nd step (keeps the context), and shows the remaining steps.
1st looks most obvious and it's making process feel shorter.
I'm also digging #2. Nice work all around.
I like #1 and #2. Very nice work man.
J. Dodds - the middle variation is the most effective. It's easy to get carried away with progress indicators since they are super fun.
The middle version is subtle, clean, and straight-to-the-point.
I CHOOSE YOU, NUMBER TWO!
Ahahahah. Thanks everyone, and thanks for making my morning, Tyler :D
@Tyler: So glad that wasn't a picture of a poop.
Two is great! I feel like a fourth option could be large bubbles with flat iconography inside of each, e.g. a truck for delivery.
Good stuff. I like the 3rd one most of all. Thanx for sharing)
by Jan Beck
Little refinement for a project
about 2 years ago
over 1 year ago
keyboard shortcuts: ← previous shot → next shot L or F like
Show and tell for designers
What are you working on? Dribbble is a community of designers sharing screenshots of their work, process, and projects.
Copyright © 2009–2013 Dribbble LLC. All screenshots © their respective owners. Shipped from Salem, Mass. USA.
Follow Dribbble on Twitter