Designing and developing web experiences.
Flex/Innovation Lab
About flexibility
Flex/The Innovation Lab is famously known for the many consumer products and packaging designs it has created over the past decades. Having clients like Grolsch, TNT post and Flexa, they know how to put down a good design. With their new tagline Creating a New Reality, Flex asked us and our technical partner Sunday Afternoon to build a completely new website supporting this new vision.
In response, we created an entirely new world and placed this as an animating wallpaper in the background of the new website, together with content windows floating above it. The resulting interface is so intuitive, that it almost feels like your normal computer operating system. Simply drag and drop windows around the website and close a window once you’ve read it.
This project was all about flexibility. Not only the user had to be able to manipulate the website contents, also Flex staff had to be free to change and edit the contents of the website from the back-end side. During our design process, this turned out to be quite a challenge: how to deliver a CMS based website that Flex could fill with its own content, but still keep the front-end design nice and slick.
This kind of flexibility will be demanded more and more, delivering highly customizable websites for our clients, yet preserving superdeluxe design and composition at the front-end.
Intivation
About total branding
Intivation develops highly innovative technology that increases the power output of solar cells. In doing so, they help handset manufacturers and network operators increase their mobile communication services.
Being a newbee, Intivation came to us asking to do a total branding job, starting with designing an identity and translating it to stationery and website.
In our design concept, we placed Intivation between the sun and the spectator, explaining their crucial role in empowering mobile devices. This is clearly seen in the logo, but also in the website, placing the sun behind the main window.
Total branding is something we like most. The challenge of streamlining an identity to multiple touchpoints keeps thrilling us. For clients it guarantees consistency, an important aspect in this fully branded and scattered world.
We think total branding nowadays should be far more flexible than it should be. We try to avoid heavy brand guides that leave your employees nowhere. Instead, we strive for lightweighted descriptive PDF's telling about ways to use the brand, rather than an endless summation of how you can't use it.
Visit project
image
Rik Wuts, Intivation
Working with Booreiland on our rebranding and new website was a very nice project. I like their way of working and their ability to look for new, exciting ways of doing things. We wanted to present our company different from the rest of the industry, and they have been very good at understanding our brief and coming up with a set of designs that communicate very well on different levels and platforms.
image
Jacco Lammers, Sunday Afternoon
Providing a flexible way of managing web content, empowered Intivation to maintain an up-to-date, no-worries website with great looks.
image
Eelke Dekker, motion designer
While cooking dinner I had a bright idea. A map of Africa, made of curry-powder. It became the best shot of the film.
image
Menno Huisman, project leader
To make the initial deadline we chose to work in agile development cycles. Nice approach to get familiar with.
image
Wimer Hazenberg, art director
Expect to see more of Rik. He's absorbed the larger part of Intivation's energy technology.
Unga Toys
About storytelling
Unga toys is an Amsterdam based toy development studio. They develop toys for big brands such as Chupa Chups, Tomy and lately for Dutch supermarket Albert Heijn as well.
Unga asked us to transform their company ethos into an adventure that could be directly transformed into a blasting online experience.
By means of storytelling we created an adventure in which the online visitor travels towards the so-called Unga Islands and experiences the magnificent world of Unga while guided by many creatures.
Storytelling is considered to be one of the most powerful marketing tools. By telling a story involving characters and a plot you can teach, entertain and convince people about certain matters. We used storytelling to communicate Unga’s company ethos, explaining their vision on toy development. The visitor gets sucked into an adventure and is immersed into all that’s Unga, leaving a powerful feeling rather than the usual dull information about a company.
So how is this beneficial? Well, first of all it totally fits to this age in which companies are using more soft and feminine approaches in marketing, trying to touch the consumer’s feeling. Secondly, a company’s vision and mission is often communicated in a better way when talking in metaphores instead of those dull corporate paragraphs you read on most websites.
Visit project
image
Toon Thijs, Unga Toys
Toys are the most elevated form of investigation
image
Jan Willem Wennekes, illustrator
The storyteller scene has to be my favourite part, I like the fairytale atmosphere.
image
Eelke Dekker, animator
I injected the unga-characters with life by giving them motion and sound.
image
Sjors de Valk, developer
Developing Unga's backend was an amazing ride; it contains a truckload of technical sweetness, yet enables the Unga staff to manage the site's contents with ease.
image
Menno Huisman, project leader
When it can't be done, do it! We built the whole thing in one month, thanks to the enormous amount of energy within the team.
image
Wimer Hazenberg, art director
The different backdrops were sculpted together from more than 250 photos!
ABN AMRO
About co-creation
Global bank ABN AMRO discovered young professionals could use some extra help in their first years working in business life. Co-creation agency Favela Fabric was asked to research what kind of advise a bank like ABN AMRO could give to these young professionals and finally transform all this into a large social platform on the web.
We were asked to create this platform on the fields of interaction and design. For such a rather complex platform we created a highly intuitive interface, ensuring the user would not get lost in a maze of general info, personal advice, incentives, networks of people etc.
Co-creation is about creating work together with the people you are creating the work for. Nowadays we can see this more and more in marketing, in which the web is used as the number one tool. Together with Favela Fabric we created a platform on which both ABN AMRO staff and young professionals can give input and build on new initiatives together. These initiatives could range from ABN AMRO as guide and mentor for the young professional or ABN AMRO as provider of projects in which the young professional can participate.
Mexx
About organic canvases
International fashion brand Mexx sees its brand not only manifested in clothing, but also seeks for other touchpoints by which the consumer interacts with the brand. Brand consultancy agency Zilver Innovation was asked to explore touchpoint possibilities and came up with the marvellous idea of building an online organic canvas. With this canvas people can work together on an artwork which gives direct inspirational input to Mexx staff.
We were asked to dive into the world of organic canvases and discover possibilities. Finally we created Mexx Mosaic, a canvas in which people can place coloured tiles resulting in a big mosaic artwork. On the back of the tiles people can leave messages for others to be read.
Organic canvases come in many forms. There are canvases on which you can edit anywhere, whereas with other canvases you get a sector in which you can edit. Next to that there are freehand tools and compositing tools. With freehand tools you can make any shape on the canvas, while with compositing tools the challenge is to make an interesting composition with predefined shapes. For Mexx we chose to constrain the user by supplying a compositing tool, the tile. In this way you don’t have to be a great artist to give input to the canvas. Besides, now the challenge is to create a great piece together only by choosing the right colour of your tile.
Zilver Innovation
About transparency
Zilver Innovation is a consultancy agency that turns brands into inspirational platforms for innovation and design. Amongst their clients are Sissyboy and Mexx. They run their business in an open and casual way, being highly professional in what they do. They asked us to incorporate these ethics into a new to be created website.
We came up with a less ordinary design involving a post-it wall on which visitors can leave messages and Zilver itself can place polaroids that show a sneakpeek into Zilver’s daily business. A truly two-way communication, something the web was made for.
Being transparent in business is a result of customers starting to ask questions about where products come from and how they are made. Giving insights into these processes make companies trustworthy on the long run. In case of Zilver Innovation there was another reason for being transparent, which was simply to show the warm and comfy feeling of the company, a big value. We chose to visualize this with polaroids, rather than putting it into text. That would have really missed the point.
Visit project
image
Erik Roscam Abbing, Zilver Innovation
Being a designer myself it is a challenge to outsource design work: you have to step back and be surprised. Booreiland not only surpirsed me, they overwhelmed me with spot on design and interaction.
image
Sjors de Valk, developer
Building Zilver instigated instant happiness. A sparkling design and a smart architecture, backed by a sturdy engine with a spiffy interface - this site was great fun to implement.
image
Menno Huisman, project leader
Always nice to work for Zilver. Like us, they feel the design process should be a dialogue, with both parties giving their input.
image
Wimer Hazenberg, art director
Details! Details! The little coffee stains on the background contrast nicely with the slick main layout.
Rooftop
About interfaces
Rooftop is Fronteer Strategy’s answer to co-creation. Their belief is that people can easier come to great new things when guided by experts. Rooftop incorporates creative sessions with experts and clients resulting in amazing innovation opportunities.
We were asked to design a premium website that would communicate the exclusive character of Rooftop. We put this exclusiveness in both design and interface, for which we used the name Rooftop as direct input.
With the evergrowing amount of information that’s coming to us everyday, interfaces for handling this information are becoming more and more important. Especially for the web this is the case. We at Booreiland see the importance of intuitive interfaces. However, we also think interfaces should be fun to work with and challenge people. In case of Rooftop we added the third dimension and made the website literally turn over when reaching for the menu.
Visit project
Designing corporate identities and visuals.
BiD Network
About personality
BiD Network stimulates entrepreneurship and economic growth in emerging markets by matching them to investors. BiD itself serves as host, while the total community counts 24.000 members all over the world.
We were asked to do a total print makeover. We designed a book called 'People, Plans, Profit', telling all about BiD's achievements in 2008. Next to that we designed a brochure and their 2008 annual report.
Our vision on this project was to make it less corporate, and introduce more personality. After all, BiD is about real people, trying to make a fair living. We implemented personality through large photo spreads, personal quotes and lots of hand drawn shapes.
From the first moment we met BiD's staff, we knew it: BiD's got personality. Then why did their visual communication lack this personality? We think it's good to show personality. It's a direct communicator when searching for the likeminded.
While it's hard to fit personality in just a few lines of text, you can do a better job expressing it into images, colors and shapes. By using fonts in uppercase we expressed the business side of BiD, while the friendly hand drawn shapes act on the emotional level. Great mix!
image
Claudia Schalkx, BiD Network
We were looking for a new approach for our corporate publications: fresh yet business like. Wimer & Menno listened to our needs and wishes, and the 2008 BiD Book, brochure and annual report are our expectations made true.
image
Welmoet de Graaf, graphic designer
How great to create for creators!
image
Menno Huisman, art director
Phone calls with BiD are unlike any other phone call!
image
Wimer Hazenberg, art director
Welmoet makes the best cappuccino and Claudia can cook a serious pasta! Hmmm!
Vormator
About creativity
Vormator is the ultimate design challenge that requires artists all over the world to create dazzling visuals by using only eight shapes within a set of given rules. This project was kicked off by ourselves, together with the amazing Zeptonn. From over 500 contestants we made a selection of nearly 80 to appear in a book, called Vormator, the elements of design. We are proud to announce that the book is now published by BIS Publishers!
You may think creativity is stimulated when you get 100% personal freedom in what to make. For some this may be true, but for most people it seems that creativity is positively influenced when constraints and limitations are given. The Vormator project shows that even with a large number of limitations and just a few elements to work with a huge variety of quality graphics is still possible. Next to that, Vormator gives insights into the creative processes behind each artwork.
Visit project
image
Jan Willem Wennekes, project leader
The project was taking over the world, one achorpoint at a time!
image
Eelke Dekker, designer
The hardest thing about designing the Vormator book, was creating spreads that really complemented the drawings.
image
Menno Huisman, art director
At first I didn't see so much in the Vormator project... I was wrong.
image
Wimer Hazenberg, project leader
I'm proud to see our concept realized in a real life book!
Fronteer Strategy
About simplicity
Fronteer Strategy is a consultancy agency that’s into innovation, co-creation and brand development. They asked us to create their corporate identity and stationery. We did it, we kept it simple.
The paradox of keeping it simple is that it is one of the hardest things to do. People are easily tempted to make creations more complex than they need to be. We try to stick to what matters, therefore keeping it simple. In this way the message is as clear as it can be.
In case of Fronteer this resulted in an identity looking like the periodic table of elements and a stationery reminding vaguely of a medicin’s instruction leaflet. Anyway, great project, great outcome. Stick to simplicity.
Stibbe
About infographics
Stibbe is an internationally oriented Dutch law firm. Together with its partners Herbert Smith and Gleiss Lutz it operates as a global network to advise clients on major cross-border activities.
Stibbe hired us to create an astounding infographic that would visualize its global network. To do so, we made up an urban setting in which cities are interconnected through roads. Each depicted city has one of more offices of the global network.
Making this thing fit on less than an A4 paper seemed a hell of a job, but also a great challenge that forced us to map everything as efficiently as possible, yet keeping it graphically appealing.
Infographics are visual representations of information, data or knowledge. These kinds of graphics are used where complex information needs to be explained quickly and clearly, and that's exactly where the challenge lies when designing one.
Infographics can also be used to overcome cultural barriers, such as language. In fact, infographics were there before language was (cave paintings!)
For the digital illustrator, making good infographics can be hard. However, when the outcome is finally there, it almost always results in great satisfaction having placed all those pixels in exactly the right place.
Designing services for the physical web.
Dutch Creative
About QR-codes
Dutch Creative is the ultimate index of creative agencies from Holland, covering practically all creative discplines. This initiative founded by BIS Publishers aims at businesses that outsource creative work and for that purpose need an overview of Dutch creativity. Consisting of a series of eight books and a complete web index makes Dutch Creative the best of Holland.
We were asked to team up with BIS Publishers and create all visual touchpoints. Besides that, we built a smart integration between the books and the web index. We chose to integrate QR-codes in the books that smartphones can interprete as web links using their built-in cameras. They link to the online portfolios of the creative agencies. This is a nice way to quickly get an update of the newest works of these agencies.
A QR Code is a two-dimensional bar code. The QR stands for Quick Response, as it is intended to be decoded at high speed. QR Codes are mainly used in combination with mobile phones, known as mobile tagging. The codes usually store web addresses and they may appear anywhere in the physical world.
QR-codes proved to be the best way for readers of Dutch Creative to easily browse the books, while being able to check the latest works of creative agencies online in the blink of an eye.
Visit project
image
Leender Masselink, Illurama
Turning objects into characters is one of my favourite things to do, and hey: I turned it into a profession!
image
Jacco Lammers, Sunday Afternoon
As a creative agency it is an extra challenge to be involved in THE Dutch Index of the creative industry. This is really a great opportunity to work together with Booreiland to get both design and functionality right.
image
Menno Huisman, project manager
Besides designing, I like that we were given the opportunity to brainstorm with BIS Publishers and give advice on how we thought web index and books had to interact with each other.
image
Wimer Hazenberg, project manager
Dutch designers, time for a fresh start! Let's go a step further than designing the old fashioned, commercial portfolio spread and do your best to present yourself in a new, ultra creative way. Both in the book and on your own portfolio web space.
Social Mutator
About Arduino
The Social Mutator is a project that was originally intented to show how we think the web can evolve towards useful and playful physical products.
It's a social game that involves mutation of a digital creature, kept and stored in a device. In order to mutate, two devices have to be connected after which creature characteristics are mixed and two new creatures are spawned. An accompanying web platform visualizes this mutation process.
Once the concept was born, we asked students of Industrial Design Engineering at the TU Delft, Netherlands, to design and prototype the actual device and web platform. Three groups of students took on the challenge, each ending with totally different results. And now one group has even been selected to present their project at the Intel Developer Forum 2009 in San Fransisco. Great job guys!
Arduino is an open-source electronics prototyping platform based on easy-to-use hardware and software. It can sense the environment by receiving input from a variety of sensors and can affect its surroundings by controlling lights, motors, and other stuff. It can also communicate with software running on a computer.
The arduino proved to be a nice platform for prototyping the Social Mutator designs of the students. We expect the Arduino will come in handy once again during our upcoming meta projects!
Check the ongoing progress of the Tate group, who are presenting their version of our concept to the Intel Developer Forum 2009 in San Francisco:
Visit project
image
Tate group
The concept goal of social networking outside was enjoyed by the visitors, it was said to be unique and less nerdy in the existing world of web based networks. When exploring the Arduino as well as the website, the reactions were enthusiastic and revering.
image
Boomki group
It shows what the meta product is all about; a combination of the virtual and the physical world, both of them being just as important and exciting. Wimer and Menno had a surprise for all three social mutator groups, a super soaker gun for each group member. They could not have bought a better gift for our group.
image
Pluma group
Main positive feedback was that it looks like a fun game and interesting to play with other people. The game can be understood easily, also because of the fact that the similarities between the online and offline environment were understood and considered simple.
image
Menno Huisman, project manager
Accellerometers, RFID and all kinds of wires... We are really building the web of things now!
image
Wimer Hazenberg, project manager
The way the students came up with their creative ideas and fast way of prototyping showed a lot of energy. I was positively surprised by the different solutions to our initial design brief. Super nice work and a big step forward in the Meta design field!
Okimok
About being dedicated
Okimok is a fun community where you can instantly share your photos with your friends. With the Okimok iPhone app you can easily upload photos to your photo stream on okimok.com. Your friends can follow you and keep up to date with your adventures.
This is a service from our own hand, one that combines a consumer product (iPhone) with the web, making it a meta service. Okimok was released in april 2009 and eversince it has been a growing community.
It's a great adventure to work on a project that involves not only design, but also aspects like research and marketing. Wow!
Okimok started off from our belief that things should be simple and dedicated. Unlike social services such as Facebook and Flickr on which you get lost in no time, Okimok chooses to do only one thing, and do that one thing very well. This is hosting your public photo stream. You could think of Okimok as a kind of Twitter for photos. In this way the message stays clear and the platform stays simple.
Visit project
image
Jurjen Helmus, sales & marketing
Creating a feasible product from an innovative concept requires hard working and out of the box thinking... what we surely did.
image
Sjors de Valk, developer
A most inspiring project! We had to conceive, create and challenge all technical matters - security, stability, scalability. Which proofs Okimok is He-Man in disguise.
image
Menno Huisman, co-founder
Ever since we did okimok I've become addicted to projects we build from scratch ourselves.
image
Wimer Hazenberg, co-founder
I'm convinced that the little okimok guy actually exists. Somewhere, he's just busy managing the photo streams of all you guys.
Young At Heart
About statistics
Young at Heart is a service created by Boost Company. It's a health monitoring tool that measures one's arterial stiffness, translating it into the more meaningful Biological Age. The service consists of a finger clip, connectivity software and a web interface, making it truly meta.
We were asked to design the web interface, which included building a Flash based graph that plots the measuring results. A great challenge, especially to keep it nice and simple for the user.
We did not want to make the graph all nerdy and stuff, so we used as little digits and axes as possible.
Plotting statistics in a web interface is of course something we know from Nike+ as well. It seems web interfaces can be excellent monitoring tools when it comes to health and sports. But also in education and gaming we can think of interesting applications, whenever performance of one person or a group of persons is important.
We expect much more of statistics in meta land in the upcoming years. Maybe some of our hand as well!