Bamboo, our design journey — part 1

Let’s get back to the beginning. I’ll try to walk you through how, over past five months we have gone from a blank canvas to a look & feel that have allowed us to progress on product and on our internal culture when it comes to design. Let’s begin our story.

Linus Ekenstam
getbamboo.io
8 min readJul 6, 2018

--

Our design journey, and exploration in time and space.

Exploring, inclusive design & fast iteration.

So when I joined Bamboo earlier this year I’d just left a highly collaborative environment at Typeform.com as one of their first product designers, seeing and helping the design team there to grow from a select few to 20+ people. With that in my baggage, I knew exactly what I wanted to instill early on at Bamboo — the notion that anyone can design.

Being a small startup we have to move quickly, I also understood some of the vital constraints we had grown less aware off as my previous team had grown larger, and risks there had grown bigger. So therefore you had more time to work on solutions. Now it was back in grit mode, churning out more design work in 4 weeks than during the previous year (joking aside). Being in a startup with little to no design legacy is both daunting and extremely satisfying. It’s a clean canvas.

First, some quick notes on the design stack. At Bamboo we use Slack to communicate. On top of that, for design, we primarily use Sketch. We’ve also tried working with Invision Studio & Figma but settled with Sketch for now. We sync all of our designs using Abstract and thus also keeping all of our design conversations on Abstract with Slack Integrated. (if you have not used Abstract, I’ll highly suggest giving it a try, it’s .git for your sketch files). And for prototyping, we use Principle for Mac, or simply just code it. There are tons of tools out there, we love them all.

Starting with simple components

Before using some of the brand exploration mood boards to try to create some app views, we need to come up with some simple components and UX structure. We can move fast here because there are already iOS guidelines and preferred patterns. We are not trying to reinvent the wheel here, simply starting our exploration process.

Exploring different design styles

Using these simple but useful components, we could start to explore some visuals based on the initial mood boards. The exercise here is simply to get people involved in the process. Making sure that early one there is a sense of communal ownership and involvement in the design process and how it evolves over time. At this point it’s safe to assume that 80–90% of the work will get tossed away. This is fine. Don’t stress it.

Exploring mood boards to better understand the personality of the brand and the app.

See it in action.

Below we explored the idea of using organic materials as part of our core design pallet. These oblongs would slowly shape shift and float either at the top or bottom of the screen. We chose luxury materials mixed with softer more organic materials. Parts of this can be seen in the middle mood board above.

One example of a quick mockup from the early brand explorations.

Going isometric

Here is another version. We kept the components and the UX pattern but applied a different look and feel. We can clearly notice the difference. This might speak more to someone that is already interested in cryptocurrencies or blockchain technology. But is it accessible to everyone and speaks a language that we can grown and evolve with? Maybe.

Another example using the same UX patterns, but totally different artwork to showcase a different style completely. (Artwork is just placeholders not ours)

Communication is vital to success

Just to show a small snippet of how the communication is being bundled and kept to the corresponding art boards. Below is a screenshot from Abstract. And while this screenshot might not show any in-depth conversation per say, it shows that people are engaged and involved. We are starting to grow awareness and inclusiveness.

An excerpt from our conversations about design explorations 5 months ago.

Learning together

At this point your team or organisation will learn that there are lot of different views on design, everyone has personal taste. People are biased based on previous experiences or favorite apps. So as a designer try to set the stage properly, try to communicate what it is that people need to leave feedback on and why. Example below is regarding the positioning of the CTA button, and Nesh had asked about the reasoning behind the position of it, I’m explaining.

Setting the stage and make sure you make it clear that you received the feedback and keep exploring.

Allow the process to take time

This might feel counter productive. You are in a high paced environment, and you want to move fast and break things. Well, trust me you will. The most important part at this point in time is to allow team members and stakeholders to reflect. While they are doing that, you can continue to do designer stuff, and create more things. No one will hold you back. But make sure you leave space for questions to be asked, and exploration to take place.

While things where unraveling, I tried some more explorations. Wanting to try a mascot, both out of curiosity one someone’s feedback. I went ahead and created a Panda. Named him Bam. And explored what it could look like if we had a mascot. While what you’ve seen so far in this article can seem quite minimal, in reality took a couple more iterations, versions and screens. I’m trying to keep things at a minimum to not bore you completely.

Exploring a mascot, this is Bam, he is a Crypto loving Panda Bear from the Bamboo jungles of China. He knows a little bit of Kung fu.

While again keeping to the UX patterns that we previously felt worked, I applied Bam to the designs to see how it could work together.

Allowing for these kind of explorations will also help you know what you don’t like and maybe what might work if you are doing something completely different from what you set out to do. I think in retrospect this is what Bam was. A slight deviation from what it is that we are really trying to do here at Bamboo. Still some of the initial feedback was instant love. But for now we are putting Bam on the shelf. Who knows he might be back sooner than we think.

Iterate and growing up

So while early explorations and preparing your team and organisation for an iterative design lifecycle is very important. It’s also very important to actually listen to the feedback and expertise that your team have. This is not just a way to justify your work as a designer, this is for you as a team to really push the envelope on what you can deliver as unit rather than having design isolated in a black box. I think far too many times this is getting overlooked by people’s personal interest and in larger organisations it feels like designers are bound to be in sticky note sessions (read meeting masked as a session) and that all of this is done without any end in sight. People will argue that the journey is what is important. I agree to some extent. But frankly we have had 0 sticky note sessions to reach to this point. none. nada. zero.

Our Icon/Logo taking shape. How we went from here to next iterations of the design.

Moving forward

Knowing yourself takes time, and it’s the same with a brand and a product. Just as an org, the design starts out as a toddler, and then becomes a small kid, that rebels and turns into a teenager. We are not exactly sure where on that scale we sit yet.

We know that we wanted to be simple, conversational and have a bit of attitude. We also felt like we found something while exploring materials, smoke, jade and the color green.

So we took what we’ve gathered as a team and worked on combining people’s feedback and see what we could get out of that.

Important note: we are still exploring here so there is nothing to be judgemental about, ideas are free and we are just trying things out. But we are getting closer to something that we like and can see ourselves grow with over time.

Simple look, clean no material or movement.
Video background, movement and molten carbon being dropped in a sea of jade.

Killing your darlings

If you have trained eye, you can see that some things clearly made it through from the early explorations phase to this iteration (might have been iteration 8 or something like that). The 10–20% of the work that we get to keep. In this case it’s typography, inputs and some other core components made it all the way here.

Along side this we had also started to look at what the inside of the app would look like, but I’ve purposely steered away from that. Mainly because it involves a lot more conversations and thinking, testing and tweaking. But I’ll throw you a bone below.

Finishing the on boarding landing in the app — more to come.

In retrospect & maturing our design

This was the first couple of weeks of design at Bamboo. Exploring design for both brand and product. For us equally important. You want your branding to support your product and vise-versa. We are further down the path today, so this is a retrospective story being told. We are trying to stay transparent in what we are doing and how we are progressing and evolving as a team. Our approach is not prescriptive or the only way to achieve success, but it’s our way of keeping design at the core of the organisation and keep an involved culture and not alienate people to get their hands dirty with design.

Some of the key learnings for us so far:

  • Don’t be afraid to experiment and try people’s ideas out.
  • One of our strongest UX designers is our commercial compliance guy.
  • Have loads of fun, and acknowledge that you as a designer is a powerful tool for you organisation, help people wield it well.
  • The devil lies in the details, get them right and don’t be sloppy.
  • There is a time for everything, wireframes, high-fidelity, prototypes.
  • I will get back on prototypes in the next part of this story.

Closing words.

Have you enjoyed reading this, please clap a quadrillion times, we would appreciate it. Also if you want to read more of our internal design stories make sure you follow us here on medium.

Part 2 in this journey will take a deeper look at how we are using prototyping and a human-centered design process to learn and iterate quickly.

We’re always happy to chat in our Telegram channel,

--

--

Linus Ekenstam
getbamboo.io

Co-founder of Sensive.xyz - Writing about being a dad, future trends, building products, AR/VR. Design @flodesk, Previously @Typeform @Thingtesting @GetBamboo