The launch manifesto

A while ago, we made a MVP (Minimum Viable Product) that people already loved, and we haven’t even launched it yet. We enjoyed every second of making it, and we realized that more we worked on it, the more we loved it. Actually, a product launch happens much before the actual launch, and the people who launch it are the ones who you should truly care about: the early adopters. I can’t stress enough the importance of their existence.

Now, we’ll just ditch the boring theory and get on to something we called the launch manifesto. It is written more or less in the spirit and slang of launcing a spaceship into space, so don’t be confused by all that.

How do you launch a product properly?

There is no easy answer to this one. But we’ll tell you something that many early-stage startups fail to realize:

Preparation is everything.

You must do your homework, otherwise you’re screwed. Build something. Build anything. Just don’t sit on your ass for nothing. Fuck it, even if your UI is still crappy, show your product to people. Fire up your smartphone and show it to your grandpa, grandma, mom, dad, sister, brother, girfriend/boyfriend, friends and people from the the industry. Makes sense right? You can go around talking all you want how you got this great idea, but where’s the juice? Nobody will buy into it – show them something real. They want to see a spaceship.

Phase 1: Set up mission control

Gather all the info you can on the problem you’re trying to solve. Talk to people. Talk a lot. Pitch them your idea, see how they react. Would they love to use your product as much as you would like to make it for them?

Phase 2: Welcome your crew aboard

When you present your idea, both online and offline, you will attract people with a similar mindset. They will want to build with you. Welcome them aboard, and get to work. You will see how much everything gets easier once you have more people on board.

Phase 3: Build your spaceship

Use whatever you’re best at. We used HTML5/CSS3/JS and PhoneGap Build to make an awesome mobile app. You can do the same. Or you can do something completely different. It’s all up to you.

Agile please!

Be agile. Boards and kanbans speed up the development process significantly. We used trello to keep us productive,  happy and even entertained while we developed. Imagine you’re assembling a real spaceship. Well, the cards in Trello are like parts of your spaceship that you put together. You drag and drop, say to the team: hey guys, I’m working on the hyperspace module, and I’ve labeled it red, because it’s super important!  It’s that much fun, but don’t forget to stay focused and deliver on time.

Trello agile

 

Phase 4: Prepare the launching ramp

A good and stable launch ramp for your spaceship is asbolutely necessary so it can lift off successfully. Buy a good hosting package and domain. Popular ones for young and fresh businesses are .io, .co domains and so on. Be creative. Then, tell people that you are launching your spaceship soon. Also, surprise them, make them wonder: how will the spaceship look like and work?

driver.io coming soon

What’s it all about?

 

The big ones might join the conversation and also support you:

 

Phase 5: Recruit astronauts

A great spaceship is worth nothing without great astrounauts, right? Make sure you get the best ones out there. Invite them to take a drive in your spaceship. These astrounauts are your early adopters and beta testers. They will either love or hate your spaceship. In most cases, if you put decent passion and work into builiding it, they’ll love it. Even more than you expected.

Use a sign up form on your coming soon page to invite them to try the product. After that, use simple and smart mailing software like Mailchimp to send them out the mission brief. Then sit back and watch them open up:

Mailchimp driver.io beta testing

 

Mailchimp graph

Open the doors to your space ship, and make them want to get in. Make them want it badly.

Find more about your astrounauts. Watch them interact in real time.

It’s crucial to know where your astronauts come from and what are their habbits, what devices they use, how technology makes an impact on their lives and what they like and dislike. Use Google Analitycs to get you started with some usual stats.

driver.io realtime stats

Use social proof that you’re doing the right thing. Be proud of yourselves.

There’s nothing better than seeing people believing in the same idea as you do. Take pride in what you do and stand behind your community.

 

Phase 6: Ask astronauts what they think about the spaceship

Forget about sending e-mails back and forth. Ask your astronauts questions they would be glad to answer. The go-to tool for this task is definately Typeform and the results are astonishing. We got feedback we couldn’t dream of. And then we made our spaceship even more sexy.

Phase 7: Establish communication channels and listen to outer space

This probably even happens at the very beginning, so open up a Facebook page and Twitter profile for your product. Communicate with people out there. Reach them and tell them about your mission. They want to know and learn. As my co-founder said it straight to the point:

After all, we’re all alike.

Phase 8: Get back to the drawing table

Based on your astronauts feedback, fix bugs and  improve small things that matter and that can make their experience a lot better

 

Phase 9: Announce improvements

People love to see their ideas built in a product. Not all of them are possible or necessary, but most of them are elligible and worth considering.

Phase 10: Initiate countdown sequence

10, 9, 8, 7, 6, 5, 4, 3, 2, 1… The time has come! Watch your spaceship lift off. This is your moment of glory. Listen to this audio to get you inspired.

Houston, we solved the problem

Now that you think everything is over, you can finally relax, head out to the bar and sip gin and tonic all you want. But I don’t suggest doing that. And it’s far from over. Go offline and get people excited. Tell them about the problem you have solved. Ask them what they like/dislike about your product, and what would they like to see more. Welcome more people aboard. Visit conferences. Go pitch. Build up like mad men, then search for mentorship, advice, investments. But do not seek for investments too early, or don’t do it at all. Steer the firm vision of your talented people and raise money only if you must.

And always but ALWAYS rembember your early adopters. Make sure that you reward them in some way after the product succeeds, for they are the core of idea.

Mission success! We hope that you learned how to launch your product with this simple 10 step launch manifesto that can be applied on almost every online business. Much luck with all your projects and never give up! The biggest reward for a successful product are the people happy to use it. You only get so little time on this planet to turn all your visions into reality. Make it worth it.

This is how driver.io looks like now. We love it. People love it. What do you think? Talk to us on Twitter or send us a mail at ping@driverio.co for suggestions and collab opportunities.

driver.io galaxy 4

Simple infinite scrolling with jQuery and AJAX

Infinite scroll with jquery and ajax

Prelude

Ever wondered how Facebook, Twitter, Pinterest and other popular social networks and well as websites have that thingy when you scroll to the end of the page, the content just keeps loading and loading ’till infinity? Well, the technique is called infinite scrolling (makes sense, huh?). Using it  is good and bad at the same time for many things – I will try to point out the good ones first.

Pros

1. Good (better) UX – classic pagination can be time consuming and not an efficient way to browse content. On the other hand, infinite scrolling provides us with better, smoother experience, without clicking around too much.

2. Cutting search results overhead – research shows that only a handful of people go beyond the first 10 results. Having that said, only 6% of users make page advancements, the other 94% are usually happy with the first result set.

3. Touch friendly – a majority of touch devices is now present, and infinite scrolling is considered to be a good and inovative way to present data on mobile devices also.

Cons

1. You can’t bookmark! – since you need to start from the top of the page again. Infinite scroll doesn’t take the amount of data into count – it just keeps going.

2. Javascript – devices with no Javascript support will have troble with infinite scrolling.

3. Losing focus –  you can easily get lost in temptation to scroll down endlessly, resulting in loss of focus. The so-called “Pogosticking” can happen when you click away from the infinitely scrolling list and are brought to the top of the list insted of your previous point of reference.

Want to build one? Let’s do it!

I will show you a way to build a very simple and basic infinite scroll you can implement to your site or project today. Let’s kick it off with a HTML5 doc

Here I included jQuery in the header, Oswald Google font for the heading, and two big, responsive images that are initially showed on the page. At the bottom of the page, I include the Javascript for infinite scrolling, about which I will talk about in a moment. But first, I will show you another HTML page that will contain other images to be loaded with AJAX. I called it moreimages.html

Same thing here, only more images to be loaded upon hitting the button of the page. Now we’re close to the fun part where we get to load this with AJAX. Check it out.

Here we use the window scroll function and calculate the size of the scrollbar compared to the size of the document. When the scrollbar reaches the bottom of the document, an AJAX request will append another set of images contained in moreimages.html to a div with ID postwrapper. While loading the images, an animation will occur, indicating the user that another page is being fetched.

In this example, the loading of this page moreimages.html will occur all the time, since we need to apply some backend logic to load this, or stop it when there is nothing more to pull and show. The url parameter of the AJAX request can contain really anything that is legit content, but some JSON/PHP data would certainly be used in a real-world app.

Styling it up

No fancy style is used here – I only made the images responsive and gave them some top margin so they can breathe. The only fancy part may be the loading indicator – you can head over to http://cssload.net/ and make yourself a nice looking and pure CSS3 made loading spinner. When you’re done, just grab the code, and put it to your style.css file.

You can see it in action or you can download the source code and experiment with it yourself to make something awesome.

Conclusion

Infinite scroll is a proof that presenting content and big sets of data can be fun and efficient, but it ceratainly has some downsides to it too. A good approach would be using a hybrid method, which would wait for user action (for example button click) before loading new pages and posts. Other than that, it is more than a fine technique in modern web design, gaining even more popularity in the web design and development world.

Hello, baby!

Yet to comeIt was about time I do something new. This time, I removed all the clutter that was bothering me for a long time, and decided to return to the basics. You’ll see a maaajor difference between the old blog and this new and fresh one. For example, it’s not so slidish and jumpish any more, and that was kinda … well, anoying (:

Second thing, I’m writing only in English now. Why? Because everybody on the web should speak English, that’s why.

I decided to take down everything I ever did – every blog post I wrote, every portfolio item I had and who-the-heck-knows-what-else I did here before, and start all over again. And it feels mighty good, let me tell you.

Stay tuned for more surprises, as I continue to grow this place, bringing you only the best.