Three UX Lessons: What I learned by making mistakes

While there may be some technical accuracy to the claim that “all the startup advice you read is wrong” my personal experience is that the mistakes I’ve made are pretty common in startup land.

I created this slide deck for Startup Drinks Hamilton. The event encourages speakers with “validated experience” (a history of making mistakes and learning from them) and that’s why I’d encourage anyone considering a new venture to attend.

LICEcap: The GIF screen recorder with a terrible name

As HTML5 and responsive patterns mature the relevance of motion in user interface design increases as well. However, when an application uses motion to communicate, static screenshots may fail to demonstrate how an interface works to clients or team members.

To that end I’ve been using LICEcap, a simple and lightweight screen recorder that renders a GIF “video” on save.  The program is cross platform, free, and made by a company with a trend toward inexplicable naming choices.

One more use: bug reports.

The LiON’S Lair: Startup trial and error

Weever Apps won the inaugural “LiON’S LAIR” competition in 2011!  The Hamilton competition offers $160,000+ in prizes and is inspired by “Dragon’s Den” (known better as “Shark Tank” in the U.S.).  I had the opportunity to provide a guest post  on the Lion’s Lair site and I’ve republished it here as it may be useful to other startup ventures.

At the LiON’S LAIR awards gala, audience focus is understandably on the entrepreneurial “elevator pitch”—those precious minutes where a visionary outlines how their product will solve a problem and become the basis of a successful new business in Hamilton (and beyond). The stakes for the competing entrepreneurs are significant: the $160,000+ in cash and in-kind services for winners guarantee a chance at making it big.

Not seen in the excitement and pageantry of the award night, however, are the weeks (and months!) of hard work put in by each competing team as they adjust their business plan, product, and pitch in response to the critical reviews by volunteer LiON’S LAIR mentors. Each mentor is a successful, experienced business person in their own right. And this is where the competition really shines—it provides contestants the opportunity to learn from the mistakes of those entrepreneurs who have gone before them. LiON’S LAIR uniquely provides contestants the opportunity to make business errors on paper instead of in practice.

The process of trial and error is so critical to new business development in Hamilton because, as a startup, you will get it wrong.

Don’t feel bad though! Almost every startup “gets it wrong” on some level… and we did too. Early in Weever Apps history, we thought we had it all figured out—an optimistic opinion that was corrected early and often as we prepared our pitch for the inaugural LiON’S LAIR competition of 2011. After weeks of intensive practicing, we had one critical breakthrough, and, to our surprise, it was a rather simple one: focus less on what we were excited about (our product) and more on our team’s ability to cope with mistakes successfully (because there will be tough times that need to be overcome through strategy and solid organization).

So while Weever Apps brought all of our (necessary) enthusiasm to LiON’S LAIR, we also brought in a honed pitch (from all those mentoring sessions) to emphasize the diversity and commitment of our team as a whole. Our new pitch won LiON’S LAIR but, just as importantly, it helped us to survive in those first two years as we inevitably “got it wrong” and had to quickly refocus our business on providing companies with actionable mobile data from the field.

Today, Weever Apps is a thriving company and we’re thrilled to be a sponsor of this year’s LiON’S LAIR. Our journey from being a few entrepreneurs with a “big idea” to part of a growing workplace that strives to offer real benefits to the city demonstrates anything is possible in Hamilton. LiON’S LAIR is not just about the money—it’s about learning how to fail…and how to get back up stronger than before. We wish the contestants the best of luck and look forward to seeing you on October 2nd.

Full-width images inside a padded container

Sometimes the most simple CSS layout rules are the most challenging.

I recently needed to make an image inside a padded container full-width.  Easy enough, right?  Just wrap the image in a div with negative margins equal to the padding.  Gawker sites like Jezebel do a lovely job of this by adding a “fullwidth-for-small” CSS class which triggers on smaller screens.

See the Pen emzQoM by Andrew J. Holden (@holdencreative) on CodePen.

But what if you don’t have access to modify the HTML? After some trial and error I created a solution using CSS3’s calc and vw properties.

See the Pen raLoyQ by Andrew J. Holden (@holdencreative) on CodePen.

The CSS calc() and viewport properties certainly present some interesting opportunities for cases where hacks using position:absolute would have been the only recourse in the past.   This method isn’t exactly elegant, but it works, and I’m sure it could be improved.