Bounce and Notable: What's the difference?

Many of you have asked about the difference between Bounce and Notable. Here it is in very simple terms: Bounce is a quick and easy way for more people to discuss web page ideas. Notable is the next step up from Bounce. Here's the break down:

Bounce lets you capture a screenshot of a website and put notes on it. You can save your screenshot and notes and share your feedback as public URL with others.

Notable gives you a lot more functionality:

  • You get privacy (no need to have a public URL for your feedback)
  • You get an SEO view to see how optimized your page looks
  • You can comment on the HTML, CSS, and JavaScript
  • You can comment on raw text of a page, like a document
  • You can have threaded discussions right on the note you left
  • You can leave notes on uploaded iPhone screenshots

Now that you know the differences between these two apps go hit the road with your favorite one!

Ask for Feedback Don't Just Give It

How do you use Notable? I'm going to guess: You want to tell your designer or engineer what needs to change on a website. You capture, annotate, share, implement. You direct another party to implement an idea you have right away.

If this is you I have a question for you: Why aren't you using Notable to solicit feedback from others on your team before you decide to implement the change? Don't want any negative feedback from people? Fear it will take too long? Don't want to be challenged? The truth of the matter is that the more feedback you get on an idea the better the idea becomes.

Notable was created to be a two-way communication tool. You share your idea, you solicit feedback, you iterate through the feedback, and you improve your idea.

So what happens when you share a Notable post?

You’ve captured a page and added some notes as feedback, but you’re skeptical about the next step. You really have no idea what will happen when you click that share button. Is this you? It’s really not scary! Here's what will happen step by step after you share your notes with someone else:

  1. You're ready to share your notes with Mary. You click the share button.


  2. You add Mary to your account.


  3. You enter a message and click Share on the dialog.


  4. Mary gets an email from you in her inbox.


  5. Mary clicks on the link in the email.


  6. Mary creates her account login by entering her name and password just this first time so that she can use Notable in the future.


  7. Presto! Mary can now see the notes you shared with her.


  8. Mary can now respond to your notes.

It’s really that easy. Remember—it’s important to give the recipient of your feedback (Mary in this example above) a little guidance after you share something with them to help them set up the first time. Just point them to this blog post to help them get set up.

Questions? Comments? Shoot! We’re all yours.

The Importance of In-Person Feedback

A lot of our work happens in a digital environment, but unfortunately it's not always the best medium for getting feedback. There's a lot to be said for face-to-face meetings and here at ZURB, we take a hybrid approach to sending and receiving feedback on design work. Here's an inside look at our process.

Digital feedback keeps work focused

Digital feedback has a lot going for it. First of all, it can be a lot easier to articulate an idea because writing things down forces the person giving feedback to think through the idea. Written feedback also serves as a great historical reference so you can recall what your team said in years past.

Digital feedback is also terrific for keeping things brief and succinct— no need for endless conversations that go on and on. It's also asynchronous and doesn't rely on matching schedules or hard-to-plan meetings. Feedback apps like our Notable are particularly useful for getting feedback because it's very specific, contextual, and takes the guesswork out of exactly which concepts are under discussion.

Some things can only be done in person

No matter how useful digital feedback is, in-person meetings can provide much better insight. For instance, body language and tone of voice are very revealing. You'll get a sense of how comfortable the feedback giver is with what they're saying and their tone of voice can help you better understand the scope of the discussion.

Feeling the intent of the feedback can also give you enough insight to get the point of the directive. Don't over look the power an in-person meeting can have toward building and creating momentum based on positive reinforcement. After all, digital feedback can seem rather critical all the way around, but both positive and negative feedback can be easier to appreciate in person.

We use a hybrid approach

At ZURB, our team use a hybrid approach because we feel that practice in digital form makes in-person delivery more efficient and powerful. Indeed, sometimes we switch back and forth several times in the course of a day. The key is to be flexible when working in the web world— being able to switch gears smoothly is important to getting useful feedback.

New Feature: Annotating just got easier!

Hey you know how you could add notes to a screenshot on Notable &mdash but nobody else could add their own notes to that same screenshot? Frustrating, right? You’ve told us. We heard you! Today we've updated Notable so that anyone gets to add notes to a page which was shared with them. It works exactly as you might expect:

  • Add notes to any page you see


  • Show/Hide notes from different people


  • Comment on anyone's note

Our goal is for this to feel more natural to use, making it easier to get ideas out of people's heads and in front of a team.

This should help you collaborate better by collecting and responding to more input, more fluidly.


Not only can the original creator of this post add notes, but so can the people they share that post with.





Notes and comments have been updated on the code annotation view (shown below), as well as the copywriting and SEO views too.

So how do you like the new way to annotate in Notable?

Bounce, Bounce, Bounce

Ready for something awesome? We're excited to announce today the release of Bounce, our newest app that helps people design for people.

What is Bounce?

Bounce is a lightweight application for giving quick feedback on a web page. You tell it the page, add your notes, and then share your feedback with anyone you want.

Why did we make Bounce?

Thousands of people are already using our flagship app, Notable. Notable is an incredibly powerful way to work with feedback and both produce better designs, and help other produce better designs.

What we want to do with Bounce is bring some of that experience to everyone else — that's why Bounce is free for everyone, has no logins or accounts, has no limit on who you share your feedback with and doesn't require any software to be installed.

What's in it for us?

Of course we'd love every Bounce user to become a Notable user — part of our motivation is to introduce people to the idea of quick feedback and eventually graduate them to the much more powerful Notable — but our motivation for Bounce is really much more fun than just marketing.

Some of it is in spreading our ideas about feedback and designing for people just as wide as we can, and some of it learning more about how people use the tools we provide. A lot of our motivation is on our end, with more innovation.

Innovation, without the overhead.

Notable is a big application with thousands of users. If we want to test out new concepts we have a built-in audience — but we also have an obligation to be more deliberate, and to be sure our iterations are a net positive for all our users. Bounce has no such limitations, so we were able to quickly innovate in key areas:

Interface Design: Bounce gave us the opportunity to try out new layouts, controls and visual styles. We tried out several ways of paring down the toolbar to a single, thin element with clear actions and controls. We also had the chance to develop a new visual style for lightweight ZURB applications — which you'll see again soon in our upcoming Parade application!

Interactions: We're always trying to refine the interactions in Notable, but in Bounce we could start from scratch and try out a lot of different ways of adding notes, creating screenshots, sharing and more. The ways you add notes, edit them, and remove them in particular are much more considered and intuitive than any we've had before (and Matt will be publishing a post soon on how we created that matrix of interactions).

Code: We're always learning better ways to create pages and applications. Bounce has been an incredibly fruitful application for us already, changing the way we implement themeable designs, improving how we structure applications, and kick-starting two brand new jQuery plugins which we've since released to anyone that can use them.

Fun with Bounce

We had a lot of fun with the visuals and themes for Bounce

Bounce has been a great learning experience for us, and an awesome way to play around with layout, code and interactions. Bounce has also been a fun place for us to cut loose a little more than usual and try out some fun elements, like supporting two different themes (regular and glow in the dark. That's right.) and a fun little javascript exercise you'll see when you go to capture a new screenshot.

Get Bouncing!

That's Bounce — what it does, why we made it, and what's awesome about it. Go try it out! It's free, fast and really easy to use. Let us know what you think of it in the comments — we'll be working to implement the lessons learned on Bounce into Notable!

Start Bouncing »

6 Tips for Avoiding Website Roadblocks

How do you push your website projects forward without getting stuck along the way? We've discussed different personality types and soliciting feedback, but how do we deal with the bigger issues designers face when launching a web project?

Let's look at six common roadblocks and their solutions:

1. No clear deadline. Although it's a simple concept, many companies have trouble staying on track. Instead of letting problems grow over time, reevaluate progress each week and make adjustments ahead of an impending disaster three months down the road.

2. Perfection. The site is never going to be completely right. Push it live and learn from customers.

3. Unclear goals to launch. Finish lines need a tangible end point. If the team doesn't know how to win, then it's going to get stuck in circles chasing ideas.

4. Poor project planning. "The easy Photoshop button," "the site that magically fills itself with content," or the "engineering problem that is no big deal." We've all heard (or made) these comments, and they never end well. Pull your team in early and ask tough questions— it's not going to get easier in the middle of the project!

5. Lack of engineering thinking. Websites are moving bits, not dynamic ad boards. The engineer you see as not being a team player probably has a few reasons why the answer is "that won't work"— find out what they are. Look for ways to incorporate engineering thinking into the early phases of a project.

6. No interface talent. Those pages aren't going to just suddenly come together by themselves. Make sure your team is stacked with people who understand how to construct web pages, it's fundamental to a successful web project.

How to Interpret Feedback

We've already talked about the importance of soliciting useful feedback , now let's take a look at how to dissect what they tell you. The biggest challenge when faced with a lot of feedback is figuring out who to listen to. Let's take a look at four different personality types and the kind of feedback you're likely to garner from each one.

Role Player - This team member wants the project to succeed and might be someone who can be your advocate, so look to leverage his positive attitude. He may soften his feedback to the point that his ideas become almost passive, so be on the lookout for subtle thoughts, ideas, and "off the record" answers.

Loud Mouth - She's full of thoughts and wants to be heard. Going against her ideas may bring yours into sharper focus, or her ideas may be ignored by the team altogether. Acknowledge the feedback this type of personality offers— even if you think you won't need to act on any of it in the end.

Devil's Advocate - This team member challenges every idea on the table. He might be just looking for better answers, or he may actually just be difficult to work with. Look at where he exposes the holes in your logic, however, and make sure you're not overlooking valuable feedback just you're dealing with a blowhard.

Corporate Climber - She's got an agenda and plans to move on it. Look closely at what her agenda is and try to read her goals. The goals of corporate climbers are often closely aligned with corporate strategy and therefore makes their advice worth listening to.

There's no magic eight ball when it comes to dealing with the different personality types that hand you feedback on a design. The best approach is to step back and consider each person's goals and agenda before discarding or acting on the advice they give.

Do you have a team member pegged?

Building a Design Consensus


"Design consensus" is an unwelcome term in design circles because it reeks of "design by committee." In a corporate environment, though, consensus can be a designer's best friend— if you know when to seek it out.

Don't always seek a consensus

In reality, seeking a consensus isn't always a good idea. Individual thoughts and ideas can be great for maintaining consistency while collaboration can sometimes take forever. If you're considering getting consensus on something, ask yourself if it's needed in the first place— maybe the project can thrive without the input of a dozen other people.

If the risk of individual decision-making isn't too costly, or the risk doesn't need to be mitigated with informed business decisions, then forget about seeking a consensus all together.

When to build a consensus

If consensus is called for, figure out the goals of everyone on the playing field. Are there advocates that understand good design? Can you align everyone else's thinking with your vision? If not, maybe you need to punt until you have a clearer picture of the team's goals.

Whatever you do, don't open up the whole problem to collaboration or you'll have chaos on your hands. Instead, break the problem into smaller parts and dole them out for specific advice from people in different business units. You're looking for buy-in at this point so put your best foot forward and sell what you know.

Finding consensus can become a complex situation very quickly, so a designer needs to take the reins and keep the process from stagnating. Let the team know that non-response is considered an acceptance of the idea, and you'll take it as a green light to move forward. Once you get the organization used to processing feedback and ideas this way, you'll get more control over the conversation and discover design consensus isn't really that terrible of a process after all.

How to Solicit Useful Feedback

For most creative people, asking for feedback is difficult. After all, who wants to open themselves up to criticism? It's a vital part of the design process, though, and both designers and team members are better off for it.

Before we talk about how to solicit good feedback, let's look at why it's so hard for us to ask in the first place. First of all, it's emotionally challenging to separate negative feedback from outright rejection. Remember, though, feedback is meant to elicit constructive criticism from others to move a project forward. It's not a reflection of your talent as a professional. Secondly, designers struggle to incorporate other team member ideas without disrupting their own creative vision. That's a tall order when you consider that shared ownership is not a skill designers are taught. Since many designers aren't particularly comfortable working on the business side of a project, you've got a perfect storm of issues that negative feedback could stir up.

The minefield of getting feedback from someone on your team or client can be successfully navigated in a few simple steps.

Highlight exactly what answers you're looking for instead of leaving the question open-ended. If you're meeting in person, give your teammate or client a written outline of the feedback you're looking for before showing a concept. Explain the benefit of each section every step of the way, and how it fits into the larger design concept. If you're discussing the concept over email, make sure the questions are contextual. Our website feedback tool Notable is a great tool for making sure you and your client are on the same page.

Choose specific people you'd like answers from, don't just leave it up to whomever the client or teammate wants to show your concept to. While the marketing team might have some useful feedback, you probably don't need to know what the client's Aunt Nancy in Chicago thinks. Be directive -- and proactive -- by calling out specific people for different types of feedback.

Make sure the feedback you get is directly related to moving the project along. There's no need to revisit issues or concerns about work that has already closed ideas down. Make sure you specify a time limit on when you expect feedback because ideas need continuity.

Create a directive with specific examples and questions: Do you feel this desaturated, rounded form fits with our older demographic? A specific question make it easier to take away feedback that can be acted upon.

Though it can be difficult to hear, you need constructive feedback to make sure your vision is aligned with that of the overall goals of the project. Remember to ask for specifically what you need to know, and don't take any of the feedback personally.

About the Notable Blog

The Notable blog is focused on discussing issues related to building this product

Notable (http://www.notableapp.com) is the easiest way to give feedback on website design (visual, code, copyright, and SEO portions of the page). You can click on an FF3 plugin toolbar button to capture a page or use the iPhone app. Notable uploads the capture to your account where you can annotate the visual, code, and copy portions of the page capture and share the feedback with your team mates.

For additional information on ZURB, check out The ZURBlog, where we discuss design interaction and strategy. We use design thinking to challenge businesses and designers to improve the products and services they create.

Made by ZURB

Notable is made by ZURB, an interaction design and strategy company located in Campbell, California. We've put over 10 years of experience building web products, services and websites into this product. Learn more »

Need some help?

Read our FAQs for quick answers or contact us. You can also follow our updates on Twitter.

Subscribe to ZURBnews

Get our monthly newsletter, ZURBnews.