Designer Service Preview Video!
Linked below is a preview video of my upcoming designer service. (I still need a name! :) )
This isn't a high-end, super-produced, glossy, perfect marketing video. I've put this together because I want to share my hard work with everyone who has been following my blog. You'll see me screw up in the video, if you're paying attention you'll notice a flaw or two in the app itself. Keep in mind, this app isn't even beta-ready! (So don't be too harsh. :) )
A few notes about the UI (that I wish I mentioned during the video):
Direct link to video. I highly recommend downloading it and watching it locally.
(I made the video with the beta version of IShowU. I'll be purchasing this app shortly, it rocks!)
(Update: Thanks to Ian M. Jones for a compressed version of the video. He ran it through QuickTime Pro and shrunk it from 90 megs to 18! Thanks buddy!)
This isn't a high-end, super-produced, glossy, perfect marketing video. I've put this together because I want to share my hard work with everyone who has been following my blog. You'll see me screw up in the video, if you're paying attention you'll notice a flaw or two in the app itself. Keep in mind, this app isn't even beta-ready! (So don't be too harsh. :) )
A few notes about the UI (that I wish I mentioned during the video):
- It's gray-scale for a reason! I don't want the colors of the app to interfere with work the designer has done. (A "Version 2" feature will allow designers to customize the look of the app.)
- There are 3 types of "Users". Administrators, Designers, and Clients. They all have different features accessible to them. You'll notice the Designer and Client only have 2 tabs, while the Administrator has 5. You'll also notice that the only person who has access to the "Approve" button is the Client, and the Client does not have access to the "Add Piece" or "Add New Version" features.
Direct link to video. I highly recommend downloading it and watching it locally.
(I made the video with the beta version of IShowU. I'll be purchasing this app shortly, it rocks!)
(Update: Thanks to Ian M. Jones for a compressed version of the video. He ran it through QuickTime Pro and shrunk it from 90 megs to 18! Thanks buddy!)
posted by Michael Sica at
2:24 PM
14 Comments:
Firstly, I just want to make clear how horrible of a graphic designer you are. It is truly a blessing that you can code worth a damn, otherwise there would be no purpose for you on this Earth. :)
That being said, here are my thoughts.
1) As a user at any level, I'd be interested in seeing recently modified/added pieces and comments as soon as I logged in. Inevitably, a client will get a call from a designer saying "Hey, I just changed blahbedy blah" and the client will log in and want to see the updated piece right away. Likewise with the graphic designer and the client's feedback. I'd suggest using the quick view style that you showed in the demo for these items.
2) The grayed out tabs look inaccessible, when in fact they are just not active. How about ripping off OS X and making the active tab colored while leaving the others black and white?
3) Assuming that your market is for web developers as wel as print media graphic designers, have you considered Flash assets as well, or ust images? I think between Flash and images you'd have a winning combo, especially with all the RIAs being made these days. Might want to consider movies too, if a client is being shown a video for some feature in a piece of software.
4) Will this scale to accept full size 300 dpi content, or is the graphic designer intended to use this by saving web-ready version of their pieces? Note that in some circles the full high res version would be useful. It might also help if part of the workflow could include a printer's login for the printer to retrieve final approved assets, or for ther web site to store te FTP sites of favorite printers so that the designer or client can publish assets directly to the print house from the site after completion.
The app looks great - you've obviously paid close attention to usability. I don't think you need to do a great dea more with the UI (beyond some slick iconage) if you continue in this vien.
- max
As for a name, how about "Pudding"? Considering that the clients will mainly be approving design proofs, your marketing slogan could be: "The Proofs are in the Pudding." :)
- max
P.S. I'll happily accept my usual fee of one Ferrari for any of my contributions that end up in the finished product.
Hi Michael,
Design Review Thing looks great, just enough functionality to get the job done without distractions.
I agree with Max on the tabs thing, the unselected tabs look disabled, colour distinction would probably be better.
I think the version comparison functionality would benefit from having a thumbnail strip along the top like used elsewhere so that you can see the differences side by side. I can see people using it as a method of showing variations on a theme (colour combinations of a logo etc) and then the client could pick a version.
On the thumbnail strip, if it is to stay above the fullsize image, then you'll need to make it scrollable or paginated, otherwise don't you risk having the fullsize image pushed way down the page when there are lots of assets?
Cheers,
Ian
Great Demo Mike!
Here are a few thoughts:
1) I'm not sure what you're using for the image resizing in Full View, but if an image was shown at a size larger than its true size, it might show artifacts of blowing it up to the larger size. Many designers use very high screen resolutions, so some small images such as logos might resize in unexpected ways and show jaggies or jpg compression artifacts. If I were using this app, I would want the default "Full View" to be the actual size of the image, not a rescaled view.
2) On the client approval confirmation, you could perhaps do it as a DIV layer confirm button instead of a simple alert based confirm? Might give your app a nice "web 2.0" touch. Would allow you to style the confirm as well. See http://particletree.com/examples/lightbox/ for ideas of implementation.
3) It would be nice for either client or designer to have a "New Comments!" link when logging in that would take them straight to the first new unread comment posted - almost like how MySpace does it. Maybe have a comments page generated that links to appropriate related images if there were many comments posted. Could even be implemented for graphics perhaps?
4) For the "View Version" functionality, it would be nice to have a "Thumbnail View" of each version of the image so you could switch between them visually rather than only by number. Would be easy to forget which number was which design if you had many versions.
I'm sure some of these ideas have already gone through your mind, but those were the things that came to mind as i watched your demo. Looks like a nice functioning app so far though! Great work.
This looks great Michael, thanks for making the preview available! It's coming along nicely. I agree with the previous comments about the tab colours.
Are you using RMagick for the image handling?
Wow, thanks for the responses guys! Let me take everyone in turn.
---
Max, you're correct. Unless you consider playing video games and talking about Transformers a purpose.
1) I totally agree! I've got a feature like that implemented in the "Projects" list, but it's hidden behind the "show details" button. (You click it and gives you some more details.) I'll probably add some more info to that area, and have the information visible without having to click on the link.
2) Yeah, that's what everyone is telling me. I've got to do something about the non-selected tabs.
3) I was planning on .jpg's day one, but it could be extended to any form of media that is viewable through a web browser.
4) Web only. I think it would be too confusing and complicated to offer up anything other than things that can be viewed through the browser.
Printer's login: i'll keep that in mind. But it's outside of the scope for the first launch.
"Pudding"? Oh god, dude. Seriously. ;)
Thanks for the comments Max, I appreciate it!
---
Ian.
Tabs: yep, me too.
Version Compare: I agree. I'm just starting to get paranoid about how much stuff there is on the screen. It's a totally valid point though, and I think I'm going to have to play with that one!
Thumbnail Strip: I've been debating this. Scrollable vs. just fill it up and let it wrap. I think just from an ease-of-development standpoint on Day 1 I'll just let them wrap and if I hear complaints from people I'll figure out a way to make it scrollable horizontally (like iPhoto).
Ian, I really appreciate you taking the time to give me your thoughts. Thanks again. (and thanks for the video!)
---
Thanks Nathan!
1) I totally agree with you man. I didn't even think of it from that standpoint. (Everything just looks so good on the Mac! Even scaled images.) I'm probably going to make that adjustment. (Default to the "View Real Size" mode and make "Fit to Screen" the initial link.)
2) I've got a ton of cool effects in there already! ;) I hear you, but I'm a little torn on it.
3) That's a good point, and ties in what Max was suggesting (#1). The whole, "what the user is confronted with on the first page to tell them stuff has changed" needs to be addressed.
4) Agreed. (See my reply to Ian's "Version's Compare").
Thanks a ton for taking the time to review the demo and give me your feedback. Your points are all valid and I appreciate it!
---
John - hey buddy, actually the image resizing thing is something I haven't implemented yet. I'm currently just leaving it the normal size and then scaling it in the browser. I planned on looking into RMagick (and other stuff like that) really soon. (Just a note: The only reason I'd physically resize the image is for the thumbnails.)
---
Hey guys, thanks "big time" to everyone for giving me your feedback. I really appreciate it!!!
One thing note about the guys who responded.
Max: born in the UK
Ian M. Jones: lives in the UK
John Topley: lives in the UK
I'm in the US, and I just find this pretty cool.
(Ian, thanks for the 18mb version)
Michael, this looks very useful. A designer was recently doing a site-design for me and indeed we exchanged some 6-7 versions. Here are my thoughts:
a) This is something my designer should purchase because I'll be a happier client if he does. So I hope it's priced so even freelance designers with few projects can buy it.
b) JPG only? Not even other browser friendly graphic formats, like gif and png?
c) Sooner or later: support for other media: from more graphic formats (psd) to html/css pages (no reason for this to be images only). Plus flash / movies etc
d) As a client I would like to be able to send images back. Actually I did this twice in the site-design process (it was easier to draw an arrow on the image than write 100 words). Maybe the comments could be rich text, supporting images?
e) The "view many versions at once" would make a good feature. Sometimes a version is representing a new idea and you want to see all of them together.
As suggested in your voice over I am here to comment on what a bad graphic designer you are!
Seriously though, I love where this is going. Most of the changes I thought of were already mentioned by our resident brit, Georgeaus Porges.
I definately agree mostly that a dashboard would help telling me, as the designer, what has recently transpired (such as an icon or style telling me that NEW comments have been logged or something was just approved.) In addition, an email notification would help speed the process along.
Another big thing for me is that most of my approvals are done via PDF. This is due to having sometimes large documents that require proofreading. Although I could screenshot every page and do it that way, it would become rather tasking for both me and the client. In addition, from experience, most people like to print out everything and read the hard copy.
Clients love to print something out, hand it to their friends, and have everyone including the family dog mark it up with a red pen.
I would hope that future versiosn would include a way for clients to actually mark up a concept and sent it back (somehow).
Shawn/Dimitris, thanks for the feedback guys. Responses below.
---
Dimitris,
a) Damn straight!
b) You're right, I was just generalizing images as JPG.
c) Possibly in a future version.
d)
e) Not a bad idea. Taking the thumbnail concept one step further. It's definitely something to consider in a future version!
---
Shawn,
Thanks man. I pride my self on my Illustrator/Photoshop skills. ;)
I hear you on the printing out thing. I'll have to make sure that my style sheet allows for a kick-ass clean printable version. (CSS can do really neat things.)
I've got some ideas for having the clients mark up the image on the screen, but it's outside of the scope for version 1. Not to mention, I wonder the following....
While it is pretty damn common for non-designers to take a designer's work and "mark it up", should it be allowed? Do you, as a designer, really want your clients drawing on the image saying, "put this here and this here"? I've debated this point in my head, and while I can see everyone asking for it, should it be built?
Oops, Dimitris. Sorry:
d) See my response to Shawn.
Response to Sica:
"non-designers to take a designer's work and "mark it up", should it be allowed?"
Absolutely. But I think it would make sense to include the markings as a different version OR (with your wicked Flex skills) apply the markings to a seperate layer that you can toggle on and off.
I thought of something else last night. Because a good portion of my work is web design, in the end stages I am usually sending URLs to the client (as oposed to screenshots) for proofing. This is especially needed when proofing interactive elements. I'm not sure how you can integrate that in this but keep it in the back of your head :)
Also, I noticed that the designer doesn't have the ability to mark a piece as approved (maybe I missed it). Many times I have a client approve something verbally in a meeting or over the phone. I don't want to have to tell them, "go this web site, click approve, blah blah blah". Also, it gives them more oportunity to rethink the approval. More time to think = more changes :).
Hi Shawn,
Designer approving the work...
I hate the idea that the designers would be approving it on behalf of a client, but I understand that's how a lot of places might have to be run.
The reason why I don't like it is because the "system" keeps track of everything and keeps everyone honest. The only person who approves it is the client, so if the client comes back later and says, "This isn't what I asked for", you can point to the system and say, "yes it is". (And here are the 47 re-visions we went through! :) )
And I have to ask the question, if you can't get the client to review the work in the system, and click the approval button, why would you even sign up for my service? Would you pay $X per month instead of just emailing the client the images? The service is going to be for designers (and design studios) who simply tell their clients, "This is how I work." "It keeps you (the client) and me (the designer) organized. We'll be more efficient and communicate more effectively if you work with my system."
That's why I'm trying as hard as I can to make the UI as dead simple as possible. It has to be lightning fast to work with and it has to be super-clear as to "what's going on here." That's why I totally agreed with everyone who said the home page needs to have more of a "there is some stuff you need to attend to" feel to it. (I've spent most of my UI time working on the piece view. The rest of the app is a little bit neglected.)
As always, I totally appreciate the feedback!!! I just reserve the right to not agree with everything! :)
Post a Comment
<< Home