Lost your Mockups key?
Log In to myBalsamiq
Already have a monthly subscription for our cloud-based web
Log In to myBalsamiq
Nick Pettit loves learning. Learning as a way to survive in an ever-changing business landscape; Learning as means of breaking into a new field; Learning as a tool for personal improvement. He recently wrote in an inspiring blog post called "Learning, Every Day" that "learning is a necessity that should be built in from the onset of any project."
His justification is that ongoing learning not only helps you stay ahead of your competition it also pays dividends as an approach to all endeavors in life. "Learning saves time, and time is the most precious resource available. We all have a limited life to lead, so it’s important to make the best of it."
He channels this passion into his role as a teacher at Treehouse, the online learning website that offers over 100 courses in the latest technologies. He teaches all areas of web design instruction and co-hosts the fun, informative free weekly talk show "The Treehouse Show."
His recent article called "How I Rapidly Prototype Websites" caught my attention not only because he mentions his use of Balsamiq Mockups but because he advocates for bypassing high-fidelity tools and jumping from rough wireframes straight to code, very much inline with our philosophy.
He's written some other great articles for the Treehouse blog, both for practicing web designers (such as "Bootstrap 3: Why all the hype?") and newbies (some of my favorites: "Things I Wish I Knew Before I Started Making Websites", "Beginner Web Design Mistakes You Should Avoid", and "How to Keep Up with the Web Industry").
I contacted him to discuss his design approach, his use of Balsamiq Mockups, and insights from his work at Treehouse. Read on for our interview.
[Treehouse] is the best way to learn about web design, web development, mobile, and business topics. [It] is a self-serve learning platform where students learn via videos, quizzes, and interactive code challenges. We also have a robust community around our Forum, where students, moderators, and teachers all help one another. As students unlock badges and earn points, they're able to show their work on their public profile. I think Treehouse stands out from the crowd because our standards for quality are extremely high and we provide a guided path for learning any topic.
Growing up I was interested in both the arts and technology. I would paint or play the piano, while simultaneously learning how to program or make websites. I found the web to be the perfect intersection of all my interests, and luckily for me, web design and development is a skill that's in demand right now.
After I graduated college I started to become interested in sharing my knowledge with others. Even though I have more than a decade of web experience behind me, I'm still a beginner at many other topics, so I know how difficult it can be when you're just starting out. Helping others overcome this frustration is what motivates me; I love empowering people to achieve their goals. I started out sharing my knowledge via blog posts and podcasting. I partnered with my friend Jim to create a video podcast that strived for quality over quantity. We became pretty skilled at talking about technical topics on camera, so when the opportunity to work at Treehouse came up in early 2010, it was a pretty natural transition for both of us.
The best part about my work is interacting with our students. Every day I receive emails, tweets, and forum posts from our students telling me how Treehouse has changed their life. It's pretty amazing when we get to hear from our students about how they were able to use their Treehouse education to land a job or get a promotion. In many cases, this has been a huge boon for individuals that need to provide for their families or pay off student loans and mortgages. These are the stories that make me jump out of bed in the morning!
A recent episode of "The Treehouse Show"
My biggest challenge as a teacher is to constantly stay on the cutting-edge while simultaneously thinking like a beginner. I need to know about what's new in the web space so that I can teach our students at Treehouse the modern-day best practices. However, I also need to understand what it's like to be an absolute beginner with no coding or design experience.
I solve both problems at once by learning something new every day. Most of the time this relates to web design and dev, but even completely unrelated topics can help. It's important for me to immerse myself in areas that I'm clueless about, because it helps me understand the struggle that new students go through when learning something for the first time.
Sometimes specific concepts are so complex to explain in a beginner overview that we later break them out into individual courses. One example is CSS layout, which we decided should be its own course, so we created CSS Layout Basics. I also rely heavily on metaphors and analogies to explain how ideas map to similar concepts in other areas.
Absolutely. I think anyone can learn to program just like anyone can learn how to read and write. There's something to be said for "natural" talent in any field, but programming certainly doesn't require it. If you like solving problems and expanding your mind, then programming might be for you.
I'm so glad you asked, because no Treehouse student is typical! That's just one of the big challenges we face every day. Some are looking to change careers, get a promotion, supplement their college courses, or just start a new hobby. Sometimes students want to zero in on something very specific, or just gain a general appreciation for work that's being done by their team members. We strive to provide an education that trains students for a specific job role and maps to real world problems.
I use rapid prototyping tools because nothing ever looks the same in the browser. This could be a result of technological limitations, responsive design considerations, screen calibration, or just product evolution. Designing high-fidelity mockups can still be a valuable exercise under specific circumstances, but even if they're absolutely necessary, they're still a big time suck. I try to jump straight from low-fi mockups to the browser as often as I can.
At Treehouse, our mission is to bring affordable Technology education to people everywhere, in order to help them achieve their dreams and change the world. We take pride in our remarkably high quality videos and our amazing community, and in the future, we plan to expand our platform in ways that have never been done before. We firmly believe that university education is entirely too expensive and time consuming, and often, it's just not suitable for the challenges that businesses face today. Treehouse aims to provide a better solution.
I've been using Balsamiq Mockups for many years now, and I've continued to use it because of its simplicity. I've tried using more general purpose drawing tools, but they never quite match the focused speed and power of Balsamiq. It's wonderfully convenient to just drag and drop commonly used design patterns into a mockup to quickly illustrate an idea.
I love the rough and squiggly lines. To some it might not really seem like a feature necessarily, but I think it's a powerful visual idiom for demonstrating that the mockup does not represent the final result. Some clients may not have exposure to the general idea of wireframing, so the rough lines are great for making the distinction between a "blueprint" and a real product.
Balsamiq makes teaching people about wireframing very simple. A general purpose drawing tool might be more powerful in certain areas, but the tools are designed to be flexible rather than focused. When I show people how fast they can iterate on an idea with Balsamiq, they're usually convinced almost immediately. I've used Balsamiq in several Treehouse videos over the years because it's so effective at outlining a project before teaching how to build it.
Balsamiq makes rapid iteration very, well, rapid. When I'm working on an important project, I always try to draw the same screen several different times without looking at my previous work. I force myself to do something completely different every time, even if it feels "wrong" at first. Sometimes my first pass is pretty rock solid, but often I'll stumble into another design direction that I had not previously considered. It's also fun when elements from different iterations combine together to form a better final result.
I have two ideas. The first one is a little crazy and complicated: I'd love the ability to jump from Balsamiq to browser using some sort of "wireframe" theme in a framework like Bootstrap or Foundation. The technical implementation might be pretty complicated if exporting directly from Balsamiq, but even just some companion CSS for designing in the browser might be a nice complement to the app.
My second idea is to actually take Balsamiq into more a "blueprint" style aesthetic. Even with the squiggly lines, sometimes clients are still confused about whether or not a mockup represents the final result. However, many people are familiar with the idea of architectural blueprints, so that metaphor could help. Even if it's just an optional skin that can be swapped in, it would be pretty cool to see.
I remember anxiously awaiting Retina support when I first used Balsamiq on my Retina MacBook Pro. I'm so glad this has been added!
I feel a bit unusual from many other web professionals in that I don't actually use a ton of tools for design. I generally stick with pencil and paper, Balsamiq, and a front-end framework. Sometimes I'll pop into Photoshop or Illustrator, but that's only if I'm working on an important project with lots of stakeholders that really need to see a pixel-perfect comp before coding begins. That's pretty rare though, and I find that it generally slows things down more than it's worth.
I like to lift weights and exercise, but I also play a ton of video games. As a hobby, I've actually started programming a game of my own in C# using the Unity game engine. I'm writing it for Mac, PC, and the Oculus Rift, and I hope to release sometime in early 2015. It's a lot of work though, so we'll see how I do!
Thank you, Nick, for sharing your tips and experience. You are a Champion!
Do you have a story to share about the awesome things you do with Balsamiq? Send an email to firstname.lastname@example.org with your stories or blog posts!
Get the Inside Scoop
We'll send you just one email a month and share a ton of information that you'll get before everyone else. More info about the newsletter here.
We'll never share your email address or spam you.
Your email is never published nor shared.
Excellent piece, I loved the causes of communication breakdown part