Mocksup says goodbye, teams up with Invision

Mocksup began in the summer of 2009 when Jim and I were working on a redesign at our old dayjob. I wanted to take the mockups I’d designed and link them together to create a quick prototype that everyone on the project could click around to get a better feel for the new design.

Back then I found only one webapp that attempted to solve the problem. It was ugly and slow and just barely did the job.

At the same time, Jim and I had started brainstorming about what app we were going to build for the 2009 Rails Rumble.

We settled on making a better version of the app we were unhappily using at work. We called it Mocksup and the rest is history.

Mocksup had a great couple of years, but Jim and I are in drastically different places than we were in 2009, and our time spent working on Mocksup has suffered because of it. It’s time for us to close up shop and say goodbye.

Starting today, April 28th, we’ll be disabling new account signups. And in one month, on May 28th, we’ll be turning the site off for good.

If you’re a paying user, you’ll be receiving an email with details about your subscription, backups, etc. You can also contact us here if you have any further questions.

The good news is we’ve teamed up with Invision to offer every former Mocksup user a great deal — 5 active projects absolutely free for the first 3 months! With Invision you’ll be able to create fully interactive wireframes and prototypes the easy and beautiful way.

Updates: Save clicks, see all your mockup’s comment history in one place and show/hide notes

We’ve been hard at work here at Mocksup HQ and over the past few days you might’ve noticed a few improvements.

Quicker access to project and mockup settings

Quicker access to settings

Before, you had to click into a project or mockup before you could access its settings page. Now each project and mockup thumbnail includes a gear icon in the bottom right that links directly to its settings page. Fewer clicks for everyone!

Better comment history

See all your mockup's comment history in one view

Previously, there were two tabs inside the comments view, one for “Current comments” and one for “Archived comments.”

The division made sense at the time, but active Mocksup user Jesse Bennett-Chamberlain suggested trying an all-in-one view where current comments sit on top of archived comments. We tried it in testing and loved it. Being able to see all of a mockup’s comments, past and present, at the same time makes a lot of sense. And we were able to eliminate the tabs and simplify the admin, which is always a good thing. Thanks, Jesse!

Show and hide a mockup’s notes

Show and hide notes

Clients love our note-taking feature, but they can quickly clutter up a mockup. So we’ve added the ability to toggle them on and off via a simple checkbox next to the “Add note” button. Thanks to Mocksup user Brian for the suggestion!

New mockup dropdown

Last month we went through a well received upgrade of our admin interface. It now takes up less space on your screen, sensibly groups all like actions together and is even more streamlined.

One of the things we updated was how mockups were displayed. Instead of displaying them in a tree in the sidebar — where they competed for space with comments — we opted to save space and unnecessary clicks by putting them in a dropdown next to the title of the current mockup. This allowed us to make comments the only thing in the sidebar, putting feedback front and center.

Yesterday we finally finished tweaking Version 2 of the mockup dropdown:

Dropdown v2

Now, from any mockup, you can see the title, thumbnail, comments and notes of every other mockup in your project. This makes it easier than ever to browse your mockups and quickly and easily go through your project’s latest feedback.

Admin design updates

Designing a user interface involves lots of trial and error. You make changes, see how they work and feel, and make further changes as necessary. This has definitely been the case with the Mocksup admin.

Old and cluttered

In the early days of Mocksup, the sidebar had mockups and comments stacked on top of each other, which was both cluttered and hard to use because neither area had enough vertical space.

Mocksup interface v1

In an attempt to fix this clutter, we moved comments into a tab behind mockups. But we eventually realized this change made Mocksup’s most important feature — feedback — easy to miss.

Mocksup interface v2

We then tried an interim solution where we moved the comments tab in front of mockups. But we soon realized clicking the “Mockups” tab every time you wanted to go to a different mockup was just too much clicking.

New and improved

Now, finally, comments are the only thing in the sidebar, making them hard to miss and easy to use. And mockups are quickly accessible via a dropdown at the end of the mockup breadcrumbs that’s activated when you rollover it.

Current Mocksup interface

After using this new interface for a couple of weeks we think this is a great solution and we hope you will, too.

And, lastly, while we’re on the subject of admin interface improvements, you might have also noticed some of the buttons that used to be in several different places have been combined into one convenient toolbar and, also, that the admin interface in general takes up a lot less screen real estate than it used to.

Good design is often about little changes that add up to make big differences. We hope we’ve achieved that so far with Mocksup and will continue to strive for it in the future. And, as always, your feedback and suggestions are welcome.

Tablet support: Now you can share your mockups with anyone on (just about) any device

Web design is no longer just about the desktop. Today, when you launch a site or app it’s expected to work on any screen size and on any device, either through multiple unique interfaces or a “one-site-fits-all” responsive design.

That’s why we’re happy today to announce tablet support. Now, typing “http://mocksup.com” into your iPad (or most any other larger-than-a-smartphone, web-enabled device) will give you a tablet-specific interface perfect for sharing tablet or website mockups.

So, say you’ve uploaded and added links to an iPad app mockup that you’re working on for a client. Simply visit Mocksup on Mobile Safari, add it to your iPad’s home screen, select your project and start clicking around. Tada! You’ve now got a simple, click-through iPad prototype that you can share with anybody.

With this launch, Mocksup is now available on any desktop, smartphone or tablet with a modern web browser. And we’ll be bringing more and more of the features of the full desktop webapp to the mobile apps. If you have any questions please don’t hesitate to contact us.