Tools Of The Trade
There are many basic tools and resources that can help early stage startups - even those with no design skills onboard - to build a design platform, get their message across to customers and impress investors.
This article is a write-up of a talk I gave at the Swedish startup incubator Minc in Malmö on March 14 2016.
I want to share a set of resources with you so that you can build a nice looking surface for your brand and make a good impression, without having a designer on your team. (Eventually you will probably need to hire one though.) To start off I will give you three general tips:
Make do
Don’t invent the wheel: Buy ready made kits. Use free fonts. Use free or really cheap templates and frameworks.
Make changes
Design has to change to make change (sounds cheesy I know, but it’s kind of true). Bottom line: don’t be precious about your pixels and don’t spend too much time on deliverables that will be thrown out soon enough.
Make it fast
This means just hitting the publish button and not worrying about it. Just work with open curtains (because NO ONE is looking at your site anyway).
Here’s an overview of what I call “The Design Ecosystem” - it serves mainly as a way to give you a general idea of different possible design deliverables your company probably will need to create or have someone create for you to execute your idea/product.
Connected to each part of the ecosystem I will share my favorite tools and services that can help you go from having no design at all to having something that looks pretty good and works well for your early stage startup. All without really knowing much about design yourself.
Foundation: the base components of your Design Eco System
1. Get a logotype
Don’t spend too much time on this because it’s probably going to change many times as you pivot. It’s a logotype, not rocket science. All you need is an icon/symbol, a wordmark, maybe a tagline and some nifty ways to combine those two according to the context. Think responsive logotype.
A while back Squarespace put together a tool where non designers can make their own logo at squarespace.com/logo. It’s a good place to try out ideas really fast.
Or you can buy a logo to make sure you end up with something truly unique. If you’re on a really small budget it might be a good idea to try out 99designs.com. Personally I’m not a big fan of their purchase model, where clients post design contests and designers work for free, hoping to get payed eventually by winning a “price”. Nevertheless I do think it can be a good way for young designers to get feedback and gain experience. I think it can also serve as a channel for many designer to find new clients in places to where they currently can’t afford to relocate in order to find jobs. If you’re a non-designer and a founder of an early stage startup the service could offer you a way to practice how you communicate briefs and concept ideas with designers in a professional way.
2. Choose a typeface.
To make it easier for you I’ll give you a list of ten of my favorite, free sans serifs. They are all available at Google fonts and you can’t really go wrong using one or two of them:
Open sans
Roboto
Lato
Source Sans Pro
Raleway
PT Sans
Fira sans
Exo 2
Work Sans
Montserrat
If you don’t like searching for typefaces at Google fonts, here’s an alternative place for you. At fontcdn.org you’ll find a nicer way to browse the type faces available at Google fonts.
If you really want to geek out on typefaces here is one of my favorite blogs about fonts and font pairings, with many beautiful examples and trend spottings:
3. Pick one main color and make a color palette
Before your have the budget to go through an elaborate design process with a lot of target group research and testing, my tip for you regarding color choice is: go with colors you personally really like. After all your are going to look at and think about this product all your waking hours during the months or maybe even years to come. It’s a plus if you like what you see.
You’ve probably heard of both Behance and Dribble. What you might not know is that they both offer a color based search option. This is a really nice way to explore different shades of colors and find inspiration for your overall graphic profile.
Often times you will need complementary colors, for example to show different button-states in your user interfaces, to highlight certain elements or just simply because it might look nicer with a set of colors that go well together. Here is a great tool for finding just that:
Communication part 1: build a structure and fill it with content
1. Create a landing page
Sometimes it’s good to have a look at what others are doing, not to steel ideas, but to get inspiration and maybe find ways to set yourself off from your peers and look different. I sometimes go to Land Book to check out the newest landing pages from all kinds of startups and other small businesses.
When it comes to actually designing, building and launching your landing page I highly recommend you to use Squarespace. Simply because it’s so much more than just an easy to use CMS with beautiful templates. They have solved pretty much everything you need, which makes their solution utterly superior. It will save you both time and money, both of which you probably lack when just starting up your business. Go there and try it out now!
2. Get unique photos
When building a landing page you will quickly notice what you don’t have: content. Not only what you want to say in terms of copywriting but most of all how you say it. A good trick to convey a message and evoke feelings is to use large photos or video clips. Mostly you won’t have the money to buy commission imagery so you will have to learn how to find somewhat unique stock pictures for free or at least cheap.
Flickr is one of my go to places when I need free photos that are available for commercial use. Just make sure you tick the “commercial use and modifications allowed”-option in their advanced search.
If you do have a budget for imagery but have troubles finding photos that feel unique and not so stockphoto-ish I recommend you go check out Stocksy. They are a cooperative of photographers, which gives their content a slightly more unique quality than the big fishes in the business. I also like how they curate photos in a relevant way, plus their search functions are awesome.
3. Find icons
In addition to photos you will also need a clean and hopefully unique set of icons to support your message. If you’re on a tight budget you can start with looking for free stuff. Icons8 and Google Material Icons are two great resources for that:
If you have a couple of dollars i highly recommend you buy a really big set of icons with many options of customization, such as colors and line weights. Most of these huge sets also have industry-specific sub sets to match your special business vocabulary, which is a huge plus. Two great places to find these kinds of sets are symbolset.com and ui8.net. Somewhere in the future when you have more money you can hire a designer to craft a custom set of beautiful icons that are truly unique to your brand. But for now, this will do:
4. Buy illustrations
Sometimes photos simply don’t fit into a brand’s style and sometimes you just need som complementing images. Then it’s time to buy some illustrations. Commission work can be really worth it if you base your entire product communication around two or more illustration pieces that need to be unique to your brand and fit well together. Otherwise you can actually make do with stock illustrations. A good way to align the stock artwork to your graphic profile is to make sure you buy customizable designs in vector format. This way you can easily change the colors to match your palette.
Creative Market launched about five years ago and has since grown to become one of the leading sources for unique illustrations, hand drawn fonts and textures. Their search tool is great, which makes it kind of easy to find relevant stuff that suits your demands.
5. Create a pitch deck
There is no way around this somewhat daunting task. Sooner more than later you will have to write and design a stunning pitch deck and chances are there won’t be a designer around to help you out. Luckily there are ready made templates out there. Here is one of my favorites: Base templates. They offer you not only a foundation for a design theme, but also ideas and input on real life relevant pitch deck content. Even if you end up not using everything, it still makes up a great exercise in bringing your message to the point by stripping down your content to a few memorable slides.
6. Fake your product (yes, everyone’s doing it)
Sometimes the best way to explain what your product is all about is to actually show the user interface in real life action. Problem is: there might not be a product around to take photos of. No worries! Just fake it! Buy a set of user interface templates here, change the colors to match your profile or add your logo and then simply upload the screen mockups on Placeit. Done!
7. Get some business cards, stickers, T-shirts and brochures
Finally you will need to make an impression in the physical world as well. Just don’t make the mistake of ordering 2000 business cards one week before you pivot and change your name… When you finally do order them, like two days before you have to travel to some huge startup event try out MOO Cards. They deliver fast.
Communication part 2: reach out through social channels and email
1. Create your social graphics
Several studies over the past years have shown that social media posts with photos/imagery succeed a lot better in terms of engagement than just plain status updates. Even when posting links you might want to add your own photo to the post, just to increase the engagement rate. It’s a good thing there are tools out there to help you with just this! You don’t even need Adobe Suite skills anymore to be a social media guru. Go check out the app Canva. It’s a tool made for non-designer to help them create stuff like social media posts, header images, print brochures or even business cards. It’s easy to use and has build in access to affordable stock imagery and free fonts.
You will also need to send nice looking emails that match the look of your brand. For this purpose I highly recommend Mailchimp, simply because they are market leaders and their email marketing tool is free up to 2000 subscribers. You will be happy to have even one subscriber in the beginning, so don’t worry about scaling just yet…
Sometimes you need one ring to rule them all. In the realm of social media marketing that would be Buffer. It saves you a lot of time, especially if your startup’s go to market strategy relies heavily on getting content out there on a regular basis and growing your team’s reputation as thought leaders.
Unfortunately Buffer doesn’t post to Instagram. So if this is an important channel for you I would recommend you add Latergramme to your toolset.
Product
1. Find inspiration
Again, starting off by checking out others can be a good thing. Especially when it comes to learning from the mistakes of others. UserOnboard is a nice resource to find inspiration and get input on best practices when it comes to creating a great onboarding experience, perhaps the most crucial part of your product. You do want to spend some time on getting this right.
2. Buy wireframe and UI kits
I will mention ui8.net again, simply because it’s a treasure island of ready made kits. Don’t worry about not being unique, I assure you there are far worse things that can happen to your product at this early stage, like for example not existing at all because you spend too much time trying to invent the wheel all over.
3. Start using Sketch (especially if you’re not a designer)
As a founder of an early stage startup with no or very limited design skills onboard you will have to roll up your sleeves and dive in head first into the world of intimidating design tools. Luckily you don’t have to learn the Adobe tools anymore, because now there is Sketch! It’s cheap(er) and literally made to create user interfaces in an easy way. With just som basic Sketch knowledge you will be able to customize your purchased icon sets and even create your own graphics for both your web site and your keynote presentations. And there is a great online course at learnsketch.com entirely dedicated to getting you started.
4. Prototype and package your design for sharing and feedback
As a founder you will have to manage your design process. Even with a small team an a few investors it can easily get our of hand, when everybody wants a say and no one knows which is the latest version of the prototype. This is where tools like Invision come in handy. There are literally hundreds of them out there and I have tried at least five of the biggest ones. I particularly like Invision for three reasons:
- It integrates seamlessly with Sketch. They’ve even launched an amazing plugin for Sketch called Craft, which is pure magic and soon will contain the feature of a live prototyping layer inside Sketch.
- It lets you focus entirely on design. No coding mindset gets in between, which enhances the workflow (for me at least).
- It lets you share your prototype with your team and outsiders in a neatly and controlled way. Plus they can make comments and give feedback in a way that doesn’t explode in your face.
In addition to landing pages and prototypes you might need creative ways of communicating your ideas on a selling and engaging level. Or you might have to quickly test some visual concept or animation style internally before putting hours of code work into it. This is where Readymag saves the day. It was originally built as a web based layout and publishing tool for making magazines. But it quickly developed into something bigger since people started using it as a prototype and web site builder. It’s an extremely powerful design tool that lets you test visual concepts directly in the browser in no time at all. I highly recommend it.
I hope you will find some of these resources useful in your daily work on creating a design process for your early stage startup. You can reach out to me here in case you need any more tips or want help with your Foundation, Communication or Product design.
