≡ Menu
Pawel Brodzinski on Software Project Management

MockupScreens Review

What’s your favorite tool to create a GUI design? Mine is whiteboard and a marker. Unfortunately it has some disadvantages. While windows and controls can be created rapidly whiteboard leaves you with pretty rough design. You don’t really think about specific positioning of all buttons and lists. You don’t think whether labels are fine or are they too long. You don’t think how a window changes when you display new controls. It’s all done when first working prototype is ready.

If you try to create clean GUI design you usually need some kind of tool for that. Usually IDE allows you to create clean sketch of GUI. A problem is that a person who should do the job rarely uses, and basically never needs other function of, IDE. That’s where MockupScreens appears.

MockupScreens is pretty light-weight application which allows you to prepare GUI design. You can prepare multiple screens using all basic controls and you can add some flow between these screens mapping actions (screen changing) with specific controls.

Strengths

Easy to use

MockupScreens is very easy to use. You need no documentation whatsoever to prepare your first design. You don’t have fancy controls at hand – just basic shapes, but that’s exactly what you need. You don’t try to polish your app – you’re building first version of your GUI. You definitely don’t need bells and whistles now. What you get instead is simplicity.


Gets the job done

It’s hard for me to get excited about this application. Building GUI sketches isn’t dramatically creative kind of task, you know. Anyway the big strength of MockupScreens is that it gets the job done. Not much more but nothing less than you’d need. Actually I always rant about lack of some features and this time somehow I don’t feel this urge. Strange.

Clickable prototype

A nice feature, especially for presentations, is you can create a usage flow of application you design mapping buttons on one screen with another. This way creating a clickable GUI prototype is very easy. This can bring you some ideas how you can improve your GUI. You can act like you heave working application with no development work whatsoever. Don’t show MockupScreens to your sales people.

Black and white screen mode

This feature was definitely proposed by one of the engineers. You can switch a design between desktop app, web app and black and white mode. The last one doesn’t try to imitate standard controls look but presents very basic design. This way business people wouldn’t think you have your app ready as they could think looking at clickable GUI prototype.


Weaknesses

Rendering speed

As you fill control options with data (labels, list elements etc) they’re automatically presented at your design screen. Unfortunately it’s slow. Oh so slow. It’s a bit frustrating when you try to fix a typo but actually a cursor is two characters after you.

Main editing area

I know I’m sick to work on 10,6 inch screen but this makes main editing area in MockupScreens pathetically small. There’s no rescaling feature either. This enforces heavy usage of both vertical and horizontal scrolls which I’m not very happy with. I guess this must be some kind of punishment or something.

Controls transparency

Controls which are used in MockupScreens aren’t transparent where there should be. It leads you to situations when you put frame on your screen and it hides everything which was there before. You can deal with it using Visio-like “bring back” and “bring forward” options but hey frame should be, well, just a frame.


Summary

Actually the best summary of a review is already written in the first two strengths – MockupScreens is easy to use and gets the job done. It’s a nice alternative for IDE features for all folks who aren’t developers and don’t need (and don’t want) Eclipse or Visual Studio installed on their machines.

As a test I created very simple design of one of web application we were recently working on and I have to say it was easier to present what I wanted to achieve with MockupScreens than with a drawing on a whiteboard. Basically what MockupScreens did was forcing me to put some order in my ideas how to arrange all controls and made me rethinking a bit whole GUI.

Having said that a whiteboard is still my favorite tool for GUI design but I’d go for MockupScreens whenever I need something more detailed with rather precise controls positioning. Using the tool is also a good idea whenever you talk with business people or a customer – they don’t necessarily have to appreciate your drawing (lack of) talent.

in: software design

8 comments… add one

  • Anonymous September 9, 2009, 5:33 pm

    My favorite prototyping tool is ForeUI (www.foreui.com), very handy and interesting :-)

  • Meade September 10, 2009, 5:24 am

    Balsamiq…great wireframing/mockup tool
    http://www.balsamiq.com/

  • Nash September 10, 2009, 9:18 am

    The project management software mentioned n this blog looks really amazing to me and its working should also meet the requirements of the user according to the description.

  • Anonymous October 30, 2009, 7:51 am

    Im a successful JustProto user and I honestly recomend this tool to everyone who's dealing with prototyping!

  • Peter Severin February 3, 2010, 7:03 am

    It good to have a tool like this as part of your IDE. This way you can apply the same skill and don’t have to learn a new interface. Plus there are other features like version control and project management that IDEs are just good for. This is where WireframeSketcher comes in. It’s a wireframing/mockup tool for Eclipse and Eclipse-based IDEs. A huge plus of this approach is that you can use this tool on any platform and not just on Windows. This is invaluable when working in a team.

  • Pawel Brodzinski February 3, 2010, 8:47 am

    If you are a developer and you use IDE as your main tool then yes, you’re right. But developers design GUI rather rarely. It is way more common situation that GUI is designed by folks who don’t use IDE at all – product managers, marketers etc. Should they install IDE just to be able to mock some GUI? I don’t think that’s a good idea.

  • Tomáš Bleša March 1, 2010, 10:08 pm

    “But developers design GUI rather rarely” … I think it’s true only for big teams/projects. Most of the software projects are done by 1-3 developers and they do everything from first meeting with customer to the installation of the product. These projects need mockups too.

  • Pawel Brodzinski March 2, 2010, 1:55 am

    Tomas,

    Developers create GUI very often, but most of the time it goes without much of design. I would say vast majority of these small projects don’t get GUI design at all – developers just hack some screens out and move on. If the client doesn’t like them they’ll fix them later.

    Besides that in any modern IDE you can mock some screens up rather easily.

Leave a Comment