Categories
Design

3 Ways to Get the Best Product from Your Visual Designer

As we mentioned in our last post, working with a designer can be an incredibly rewarding experience. But how do you make sure that your end product actually looks how you want it? How do you get a product that feels like you? And what does the design process look like?

Let’s break it down into 3 pieces: 1) Illuminate, 2) Iterate, and 3) Communicate.

Illuminate

To kick off the design process, you’ll first want to illuminate your product for your designer. Your goal here is to “shine some light” on WHAT the product is, and HOW it should look.

WHAT: What’s your elevator pitch? What’s the value proposition of your product? How are you different than your competitors, and what about this do you want to come across?

HOW: At this point, you probably have a sense of what your app’s design should look like – either in visual terms, or at least what emotions and thoughts you want it to evoke in your users. You may even have some examples of things that you like / dislike. If you have one, share a portfolio with your designer showcasing examples of visual design that “feel” like your app. These can be other apps and logos, screenshots of UI’s that you love, pictures of street signs, advertising, or even storefronts and architecture that just feel right.

Try to pinpoint what about each of these elements appeals to you – is it because the blockiness of a building communicates strength and that’s part of your brand persona? Is it because you like a bright color for an app in the kids space?

And don’t forget to include what you don’t want your design to include – namely imagery or colors used by competitors.

Iterate

As with every creative process, you should expect a certain amount of back and forth with your designer once you’re ready to kick off. Now that you’ve shared your vision for the app, it’s time to iterate early, and iterate often.

Typically, you’ll be able to react to designs at several different stages (and in fact, this is something you’ll want to ask about when interviewing potential partners). Ideally, you’ll get to first see a few napkin-sketch options for color palette and theme; these are an easy way to provide some high-level direction about where you want to go with the design. Then, it’s often a good idea to have your designer mock-up what a landing page might look like before diving into the rest of the site. This will help you get a feel for how things will look in more detail, and can make some higher-level stylistic tweaks before applying that look-and-feel to the rest of the site.

At this point, your designer will create designs for every screen of your application. Because your app might have anywhere from 5-50 screens / pages, it’s best to communicate frequently (and in detail) before getting to this point. It’s much easier to make stylistic changes earlier on – saving smaller, page-specific changes for this last stage.

So iterate early, iterate often, and….iterate positively (onto step 3).

Communicate

Design work, which can be based heavily on feeling, intuition, and creative inspiration, is personal in a way that programming is not. This is what makes custom design so special, and powerful. It’s important to keep in mind that when you iterate on designs, effective communication largely means focusing on the positive.

Two reasons for this: 1) Feedback resonates better, and more constructively, when it has a positive slant, and 2) It’s easier to steer your designer towards the right direction than away from the wrong direction.

Chances are, you already intuitively understand #1 – we’ve all been the recipients of constructive (and not-so-constructive) feedback, so let’s talk about #2. When it comes to designs, you’re presenting a concept with an essentially blank slate. That designers can turn something as nebulous as an idea into something that resonates with users in a visual way is to us, quite frankly, amazing (not being designers ourselves). And to get there, we’ve found that it can be tremendously effective to focus on what you do like, rather than what you don’t like.

Think of it like a map. There are an endless number of directions a designer can take a product – so by pinpointing what you do like, it’s much easier to continue turning down the right streets, to arrive at just the right destination.  That’s not to say you shouldn’t call out what you don’t like; avoiding the bad neighborhoods can be equally important to get to that simple, elegant, something special. Just be careful not to get stuck in the weeds.

So…there you have it. Illuminate, Iterate, and Communicate (positively). Now have fun!

Categories
Branding Design

How to Find the Right Visual Designer for Your Product

This month, we’ve been talking all about design. We do this A LOT because we’ve seen how much designing FIRST can impact whether your product is successful – from a financial perspective, to understanding what your customers really want, to even getting funding to make it all happen.

One of our readers sent in a great question about how to actually get started, so we’ll focus on that today. Have a question too? Contact us!

“I read your last blog post on “App Design Options”, and I think I want to go the custom design route. How do I find a designer, and how do I know if they’re right for me?”

Working with a designer can be an incredibly rewarding experience, as you see the product you’ve been thinking and dreaming of come to life in a visual way. For our parent readers, it’s (*almost*) like meeting your baby for the first time 🙂 Ok, not quite, but you get the picture!

But how do you figure out whose style is right for you? Who’s your optimal match?

In a way, it’s a little bit like online dating. (*Disclaimer: The founders of Lionheart Software got married before Tinder hit the market, so we have a limited understanding of this world.)

The first step to finding a designer is determining what YOUR personal & product styles look like.

And these can be different things. Before you even reach out to designers, start building a “profile” of what feels like you and your app.

Take a look at brands you admire. Are there certain stylistic elements you like? Does bold, block lettering resonate with you? Does the color scheme for a particular app “feel” like your product? Are there signs on the street, business cards from colleagues, or even architectural elements in the world that strike you?

Once you have your profile completed, start looking for your match.

Are there designers whose styles already feel like your app? They’re going to be a great place to start. But don’t forget the designers who have varied portfolios – sometimes the best fit is actually going to someone who can capture the unique visual persona of a particular app. The former will work really well for you if you have a pretty clear sense of what you want to accomplish visually; the latter can be gold if you have a general idea of your brand persona, but no particular affinity for certain visual elements.

A few tips:

  • Don’t be afraid to contact startups you admire directly if you like their visual style. Most will be happy to connect you with their designers (assuming they outsourced the design, which is typical for most early-stage companies).
  • Be patient. Finding the right designer can take time.
  • Ask to see a portfolio, and have them explain their process. How many rounds of revisions do they typically include?
  • Start early. Don’t wait to start looking for a designer – ideally, you want to have someone lined up to start as soon as your wireframes are complete.

Ready to get going? Check out our post on how to work with your designer to create the product of your dreams.

Categories
Design

What Type of App Design is Right for You?

Last week, we talked about the benefits of designing your app before you build it. Save money? Get to market faster? Maybe even get some funding while you do it? Sounds pretty good to us.

But how do you get started with designs? First, you’ll want to create wireframes – which map out exactly HOW your site is going to work. And from there, you have a couple of options.

Option #1: Custom Design

What is it?

With custom design, you’ll hire a trained designer who will take your wireframes and turn them into something beautiful. This means they’ll come up with the right color scheme, button style, imagery, and placement on the page to make the user experience seamless. Generally, when working with a designer, you’ll iterate multiple times before you get to your final product – starting with high-level sketches, a landing-page mockup, and then more final designs. The ability to provide feedback at every step in this process ensures that you’ll land exactly where you want with your final product, and is easy to hand off to development.

Is this right for me?

Do you have enough budget to cover custom design? Do you have enough time before you have to get to market? Do you feel that your product needs to strongly communicate a unique brand image? 

Is this right for my product?

Is your product a little bit more complex than the average app? Is UI going to be key to the user experience? Are you anticipating that your features might need a little more explanation, or guidance? Or do you really need to differentiate yourself from competitors in the market?

The Net-Net

Pros: By working with a designer, you’ll get exactly what you want. It’ll feel “right”, to you and your customer, and you won’t have to re-work anything down the line. A quick and easy handoff to development means little iteration will happen during programming (speeding up time and keeping costs down).

Cons: Can be expensive depending on how extensive your design is, and will take longer.

Option #2: Off-the-shelf UI

What is it?

Off-the-shelf UI components are essentially packages of visual elements that can be used by your developer to create your site. What does this mean? A package will include your theme colors, a particular style of buttons, headers, and links, and templates for app elements like dashboards, forms, messaging, and beyond. Each package is a little bit different, and will either focus on a particular style or type of app (e.g. a more data-driven package will have better templates for dashboards and graphs, a more standard package might have more templates around messaging and form submissions).

Some examples include: Bootstrap / Bootstrap UI, Agile UI, Telerik, CoreUI, and Now UI Kit.

(Note: these examples are all free off-the-shelf UI components. While there are paid versions that are a little bit more customized, the free, open-sourced ones are going to be better quality since they’re more frequently updated).

With off-the-shelf UI, your developer will be the one implementing the design, which means there can still be a fair amount of back and forth about things like exact placement on a page – depending on how closely the package templates mirror your wireframes. And you’ll need to be a little bit more involved in those decisions than with a designer (whose wheelhouse it is to know the right answer).

Is this right for me?

Do you have a tight budget? Do you need to get to market really quickly? Do you have a pretty clear vision for what you want your site to look like, and is it fairly streamlined?

Is this right for my product?

Is your product pretty intuitive to use, with a fairly small feature set? Are the calls-to-action something your users will easily understand? Is your product more like a utility than an experience (i.e. doesn’t require as strong of a brand image)?

The Net-Net

Pros: Cheaper and faster, can work really well for simpler applications.

Cons: Requires more iteration with your programmer (who is likely not a designer) and may cause some re-work (both in the initial phase, and down the line when you’re ready to further customer your product). Also offers less customization for your individual brand.

Ready to go ahead with designs? Don’t miss our post on how to find a designer.

Categories
Design Getting Funding Saving Money

Why Graphic Designs Matter: 3 Reasons to Design Your App Before You Build It

If you’re a startup founder, you’re probably pretty concerned about three things when it comes to building your product: saving money, getting to market fast, and selling a product people actually want. You might be strapped for cash, and anxious to ship a product before your funding (or, ehem, stamina for juggling a side hustle and a full-time job) runs out.

At this stage, it can be really tempting to rush into developing your web or mobile app right away – because the sooner you program, the sooner you can start making money, right? Unfortunately, that’s usually not how it goes. And while it may not be a silver bullet, doing web & mobile app designs first has a lot of perks.

1. Doing graphic design for your web or mobile app can actually save you money and time.

Don’t be deterred by the up-front costs of hiring a UI/UX designer (i.e. graphic designer) for your app. Creating designs for your app actually helps you save money in a couple of ways:

  1. It’s an easy, low-cost way to test assumptions about your product.
  2. It reduces iteration when it comes to web development.

Test before you invest.

If you’ve been with The Startup Hacker for a while, you’ll know that we sing the praises of market research. Constantly. Because it’s that important. Do it often, and do it early (we’ll talk about this more later).

But while there are lots of really successful ways to do this at every stage of your product’s lifecycle, when it comes to testing the usability of your app, it’s A LOT easier for your customers to react to something they can actually see.

While some early market research will identify what pain points you need to address, it can be really hard to get good feedback on the nitty-gritty user interface (UI – i.e. the pretty stuff that customers see) unless you have designs that clearly illustrate the vision. You’ll be amazed at how many things you thought were critical turn out to be “nice-to-haves”, or even cumbersome and unintuitive when they’re mapped out on a page. And the more you can cut from “need-to-have”, the leaner, meaner, and lower cost your MVP will be.

There’s no reason to build out features your customers don’t actually want. Getting some customer feedback on the interface they’ll be using before you build it will save you the trouble and expense of having to re-vamp your product substantially after launch.

Plus, it’s much cheaper & faster to change designs than code, which means that by the time you actually build your app, you can build to what you KNOW (rather than what you hypothesize).

Beautiful designs = beautiful code.

A really good web app design can take a while to create, but that’s a GOOD thing. It’s critical to get your graphic designs locked down BEFORE you build. Your app designs are for your web developer what a 3D rendering of a home’s interior would be for a builder – and a beautifully done graphic design (paired with good wireframes) can eliminate 90% of the back-and-forth with your developer, as well as the bulk of the changes you’d probably end up requesting (all of which takes time and money).

What happens if your designs aren’t done? Here’s a snippet of what you might run into in development:

  • You realize you’re missing a page for contact information. Now you have to go back to designs, and add the page in (which takes time).
  • You decide to add a new button, and have to go through several iterations to figure out where it should go – which requires re-working the code to move other buttons around (which takes more $$).
  • You realize you haven’t really thought through how users will move through a particular flow, and that the current UI is clunky. Now you have to re-work the entire thing, which generally means your code is messier and more prone to bugs (takes time and $$).

This kind of re-work can turn development into a slog. It’s not good for your morale, your developer’s code quality, or your pocketbook.

(psst…don’t forget to wireframe as well – this will help you avoid a lot of the same pitfalls. Sign up for our email list to get our step-by-step guide to wireframing and more!)

But wait, that’s not all – onto #2…

2. Designing your app first can get you funded sooner.  (without investing a lot of your own capital up front).

Let’s face it – building a product from the ground up can be expensive. And it can be hard to bootstrap all the way, which means you’re often looking for funding BEFORE you start development.

Believe it or not, you can actually sell a team & investors on a design-focused vision really effectively – whether or not you have a working product. All without having to invest a lot of your own capital up front. I don’t know about you, but when we were starting our first business, this was key! Software development can get expensive pretty quickly, and it’s a lot easier to bring the product of your dreams to market when you have the cash to do it.

But there’s a catch-22: investors would rather fund a working product.

The key here is to sell the sizzle, not the steak.

As we discussed earlier, it can be really hard for people to understand exactly what your product does without visual designs. And we’ll let you in on a little secret – showing off really complete, well-executed designs has basically the same impact as a demo with a working backend. So by doing your designs up-front, you’ll demonstrate that you’ve not only done your research, you’ve thought through the ins-and-outs of your product, and have the design sizzle to polish it off.

Because a product demo is often no more than designs with a little bit of code behind the scenes to “fake” how the product works, designs alone (paired with an awesome PowerPoint presentation) have just about the same effect. And we’ve seen companies like The Black Tux (one of our early consulting success stories) do just that.

3. App designs let you test what your customers want early – which means more product success after launch.

We talked earlier about how you can save money and time by testing your graphic design with customers. We’d all prefer not to re-work app features after launch – we have more important things to focus on like marketing, scaling, and adding new features.

But beyond that, there’s another, possibly more important consideration. If you don’t get some feedback from customers now, you risk losing them very soon after you launch. In fact, according to TechCrunch, 1 in 4 users will open an app only once. And 90% will stop using your product if it has poor performance. Those are pretty high stakes!

Now, in an ideal world, you’d catch any issues during beta testing – but first impressions are lasting, and if your app feels clunky, poorly thought out, or is missing something important, that’s the first thing people will read about when they’re checking out your product.

To sum it up: Saving time and money? Getting funded without too much personal investment? And a better, more lucrative product launch? Sounds like a no-brainer.

So do yourself a favor: design your app first.

Ready to get started with designs? Check out: How to hire a designer, What type of app design is right for you, 3 ways to get the best product from your designer

P.S. There’s an important component of “Design” that we haven’t talked about here – which is designing WHAT the product is, not just HOW it works. This is just as important as designing before building – and we’ll talk about that next month on the blog. For teasers and free materials on our upcoming series “Mistakes Startups Make – and How to Avoid Them”, sign up for our mailing list.