Blog


Nov

Lean Startup Camp in Tokyo


The Lean Startup Camp

Inspiration. If I have to pick one word to describe The New Context Conference held by Digital Garage in Tokyo November 3rd to 4th, it's inspiration. CJ was invited to speak about integrated design and development.

The conference, also called Lean Startup Camp, was inspired by the book The Lean Startup by Eric Ries. A book that teaches entrepreneurs how to be more innovative, stop wasting people's time and be more successful. The most frequently used words during the conference talks were lean, agile and design. Something that Digital Garage hopes will inspire the attendees to go out and change the way Japanese companies work today.

You need a compass, not a map

When working the agile way you need to know what direction you're heading but not the precise way. Joi Ito talked about how things change along the way and how you should embrace that.

Our friend Ian McFarland, CTO at Digital Garage, held a keynote about the importance of design to make better software. A subject that the speakers and panels kept returning to throughout the day.

The first panel discussed how design is about experience, not looks, and how a designer's most important job is to understand the user. It's important to be agile about design, doing things in small iterations, doing a lot of testing and getting feedback. Don't be afraid to fail. Failure is discovery, a learning process.

Why build something until you know if it will work?

Kate Rutter talked about how to use a MVP, Minimum Viable Product, to get useful feedback from users before investing too much time in building a full product. It can be a sketch on a paper or a really small application. Our friends at Hyper Tiny emphasised the importance of finding the one important thing about a product and focusing on that. Say no to all other features.

Agile Blues

There seem to be a lot of rules when working agile. If you are new to the agile way this can feel discouraging, do you really need to follow the rules? Yes and No.

I like the comparison Joe O'Brien made between the agile way and blues music. There are a lot of rules, but when you know the rules you can break them and build/compose exceptional products/music.

Preparing, Sharing and Caring

CJ talked about how we work at Elabs, the importance of letting designers and developers work together. You should start every project with the whole team, preparing together. If everyone is in from the beginning there will be a better understanding between designers, developers and the client, which will result in a better product. During the project designers and developers can be more efficient by working in the same code base and pair programming. Last, the most important part is that developers care about the design and designers care about the code. Getting rid of the "not my job" mentality.

Integrated Design and Development panel

Get feedback

The first day was wrapped up with a talk from Janice Fraser. According to her the most important thing is to get out of the building, get to know your customers before you build your product. Learn who is going to use your product and what they are going to use it for. Make MVPs and remember that it's hard to build a new product, it takes time. She emphasised the continuous cycle of: build - measure - learn, or think - make - check.

We had a great time in Tokyo and met a lot of interesting people. The Lean Startup Camp was a very well produced conference and we are very happy to have been a part of it.

Arigatō gozaimasu.

Mar

Streamio Marketing Site - the Design Process


I will explain my typical process when designing a marketing site by showing you examples from my work with Streamio.

Why Streamio? Because they are a fun company to work with, easy to cooperate with and they give clear and good feedback.

First I got a mockup from Streamio with some thoughts and wishes. It's actually rare that you get a mockup this good from the customer:

The mockup from Streamio

The mockup from Streamio, which I'm very impressed with. Sooner or later they won't need my help anymore :).

An important thing with a marketing site is to get the user's attention. This is done by giving enough information in a short amount of time, so that the user gets interested and keeps on reading further down. This means that we need to scale down the information, put it in a natural order and keep it simple and clear.

It's quite known how much, or little, we read on the internet. Studies show that we read very little, I myself is a typical example. We browse sites very fast, and it doesn’t take many seconds before we jump to the next one. This is something we have to think about when designing web sites, we only have a couple of seconds to catch the users attention, not much more exposure then a logo. Some interesting articles on the subject are UXMYTHS - People read on the web, How Users Read on the Web and E-Mail Newsletters: Increasing Usability.

The first thing I do in the design process is to look through the information on the customer's mockup. The second step is to make my own interpretations. My first thoughts on the Streamio mockup was that there was too much information and the headlines were unclear. On the following drawings I have scaled down the information and changed the layout in the at the top:

Draw with pencil on paper

I love to draw with pencil on paper - a great way to get your thoughts down at the beginning of the process.

Close-up on Streamio's mockup

Close-up on Streamio's mockup.

Final drawing of the design

My final drawing of the design, which I showed Streamio.

What's left is:

  • a short headline about Streamio: they help you upload and publish videos online.
  • then a picture of a computer and two devices with their video platform or video, to show that it works on all modern platforms.
  • followed by 3 short blurbs about their advantages.
  • the 3 blurbs are then put into one sentence to make it even more clear.
  • a prominent Call-to-Action button makes it easy for the user to try the service.
  • finally there is a price tag with the minimum price.

When I'm done I show the customer the new drawings. This time Streamio was happy with the result, so then I continue with the next step: the real designing.

I design directly in the web browser, which is most efficient today. This way you work closer to the end result and you don't have to work in two steps, like when you're using Photoshop. I do additional graphical elements in Photoshop, but I constantly look at the end result in the web browser. Another great advantage with working in the web browser is that you have access to A LOT of fonts from @font-face services, such as Typekit. Today you can do a lot with the design using html and css3, which I'm sure you already know, but if you want to read more about it you can take a look at Smashing Magazine or NetTuts.

Two fonts

Two fonts used on Streamio's site. The first one is the popular serif FF Tisa which I think is great! It is used for all the content on the site. The second one: FF DIN Pro Condensed, is used for the logo.

First layout

This is my first layout after the drawings. Here I have made the basic layout and placed the content, and made some screenshots and additional graphics. But it is a bit plain and boring.

Streamio likes a very sharp and glossy style, and I won't say no to that. A lot of sites can't pull this of, but I think it gives a great vibe and harmony to this site and it works with Streamio's kind of service.

Some screenshots from the final site:

Final site 1

Final site 2

Final site 3

I really like the last page because it's only built with three images. It's a fun challenge to try to use as few images as possible. This keeps the loading time for the site short, or rather compensate for custom fonts.

Streamio launched their site on March 7th. It looks a bit different from my final version because they combined some of the final design with some of the earlier to create what they want.

Take a look at Streamio.com.

In my next blogpost I will write about the design process behind the actual video tool which David at Streamio has developed and I've made the design for.

If you have any comments or questions you can text me on twitter: @leuchovius, thanks!

Feb

New Office - Renovations Needed


We recently announced that we'll be moving to a new office later this year. There's lots to do before we can move though, and in this post we'll talk about the current state of the office building, and some of our plans for it.

Pairing room from hallway

What really made us fall in love with the office space, in addition to its history, was all the old details. The building was constructed mid-19th century, and a lot of the original interior is still there.

We feel that the classical elegance and attention to detail really reflects our craftsmanship ideals that we strive to uphold when we develop software. It's a very inspiring environment. The old wooden paneling is classified as historically significant and must be preserved. It really makes the office something out of the ordinary.

Conference room and hallway

The office hasn't been used in quite some time, and needs to be renovated. New flooring and carpeting will be put in, windows will get noise insulation, walls and ceilings will be repainted and some glass partitions will be installed.

The fun part about the renovation is that we really get to tailor the office space to our needs and our style. We're working with a friend of ours, Jesper Larsson, to make this a great environment that we will enjoy working in.

Check out the "before" photos, and come back soon for more info here on our blog.

Jan

Our New Office


Back at the office and looking forward to the year of 2011. One exciting thing happening this year is that we're moving to a new office in Gothenburg.

We have been looking for something new for a year. Since Elabs started two years ago we’ve been renting space at Edithouse, which has been great. But we need more room and we want something of our own. Something that reflects the kind of company we are. An office out of the ordinary.

We need a spacious place with room for the developers to pair program undisturbed. A creative environment for our designers. Room for our customers when they come and work with us and for the developers in our Stockholm office when they are visiting Gothenburg. We also need a space to hang out and finally have a real ping pong table.

Now we've found it.

The building is called The Hasselblad House and was built by Victor Hasselblad's grandfather in 1875. Victor Hasselblad is famous for his camera inventions. Neil Armstrong and Buzz Aldrin used a camera from Hasselblad to shoot photos from their landing on the moon and Lennart Nilsson used Hasselblad's cameras to take his amazing photos inside the human body.

Hasselblad had their headquarters in this building for over 100 years. It was also used as a residence for the Hasselblad family. In 2003 Hasselblad moved to a new building. Now most of the house has been carefully renovated and converted into apartments. There are two office spaces in the ground floor, and one of them will be ours.

Right now we're working with our architects and designers, planning the renovations. We'll have more to share about that shortly. Then it's a long wait until June, when we move across the street to this building:

The Hasselblad House

Dec

The Year 2010 - A Summary


Today is the last day before the Christmas holiday. We’ll be back January the 3rd and share some exciting news with you, but for now; a quick retrospective of a fantastic year!

One of our favourite events of the year was the inaugural Nordic Ruby. We had a great time and it was fantastic to have so many people here. Hopefully we’ll se you all again at Nordic Ruby 2011.

Another big happening was the startup of our Stockholm office where Ingemar and Dennis are located. Hopefully they will get some company next year. Our team in Gothenburg grew as well, with the addition of Johannes and Nicklas at the beginning of 2010 and then Antony as well. This means we have doubled our team from 5 to 10!

In March we had a company trip to Scotland where we focused on our coming products. Serenity will be the first out, a simple scheduling app for project planning. It's currently being beta tested and we're aiming for a launch in the beginning of next year. We’ve also developed our first iPhone app, for one of Sweden biggest banks, SEB. Great fun, and we hope we’ll do more of that during 2011.

Merry Christmas and a Happy New Year!

Best wishes from

CJ, Lilly, Jonas, Jimmy, Johannes, Antony, Anders and Nicklas in Gothenburg

Ingemar and Dennis in Stockholm

Elabs