Deprecated: Function create_function() is deprecated in /home/eleanorh/public_html/wp-includes/pomo/translations.php on line 208

Deprecated: Function create_function() is deprecated in /home/eleanorh/public_html/wp-includes/pomo/translations.php on line 208

Warning: Cannot modify header information - headers already sent by (output started at /home/eleanorh/public_html/wp-includes/pomo/translations.php:208) in /home/eleanorh/public_html/wp-content/plugins/atticthemes-blog-extender/atticthemes-blog-extender.php on line 463nCube Home | Eleanor Harding

Eleanor Harding is a product developer and supergeek who has been called the swiss army knife of tech. She is originally from South Africa and has a background in both development and design, helping her win numerous hackathons including the prestigious TechCrunch Disrupt Hackathon and the Skype Codess hack for women in tech.

Before arriving in London, she created an indie game which won the Microsoft Imagine Cup and was the design engineer in the winning, all-female team in a competition to design and race scale F1 cars.

Eleanor is now the founder of a product development consultancy called Rigby/Rose where she spends her time doing what she loves, helping startups turn their big ideas into elegant products. In her spare time she looks for ways to enable people through technology, listens to a ridiculous number of audiobooks and networks furiously.

nCube Home

nCube is the brain at your home’s heart.

This hub + app is an elegant IoT solution.

nCube enables you to control all your connected devices through one interface – for a truly smart home.

+ Design Lead
+ Executed a Product Design revamp and rebrand
+ Crafted a natural language interface model for comfortable human-computer interaction
+ Created a design language for the software and hardware, working in collaboration with MAP Project Office

Project Overview

Instructions received:

“Over a 3 month period, take the app from beta to launch. Redesign the brand and make the app better. Improve the user experience.”

At this point, they have a functional skeleton of a product. I would need to create and apply a design language, improving the usability and user experience as I go.

Plan of action:

Create a design language, then translate the language into these parts:

App Design

Evaluate the structure and UX of the app from the ground up. Break it down into all of its parts, simplify, streamline, improve the experience. Create a model, sketch screens, define Information Architecture.

Create a high-level version of the UI using the new language – a “looks like” prototype

Roll out the new UI to the streamlined version of the app

Website Design + Dev

Design

Development

Physical Product Design

Collaborate with product designers to ensure the language is translated

Collateral Creation

Business Cards, Posters, Banner, etc

Bonus round: Kickstarter campaign

Problems I worked on:

Managing combination of tasks and expectations

Use the existing task management infrastructure to integrate smoothly with the rest of the team

Setting realistic deadlines and ensuring that tasks are completed on time and to a high degree of execution, in line with the overarching project goals

Results achieved:

Project completion within the 3 month window including 2 weeks spent on the kickstarter campaign

Took the product from beta to launch quality

The work I did over the 3 month period played a fundamental role in the success of the kickstarter campaign

Extra tasks to make the CEO’s life as easy as possible

Embrace and learn to use their existing task tracking system quickly

Do regular design reviews and check ins

Work closely with the developers from day one to get buy in to the new version of the product

1. Create a design language

Instructions received:

“Make everything look and work better, do a rebrand if you need to.”

Build on top of the existing work – take it to the next level. Introduce new design where appropriate, tie everything together seamlessly with the implementation of a unified language across the product ecosystem.

Existing brand:

The actions I took:

Deconstruct the brand and product into its form

What does it do?It controls the individual connected devices in your home to work together

How does it work?nCube sees each individual device as a module, then allows you to create a relationship between them

What does it represent?The brand represents a system of modular devices which interact with each other

Chose a core overarching concept: Cubes

The cubes are individual, modular items. This idea of cubes then evolved into a world in which they interact. This became the basis of the design language – smart, clean, chaotic, modular, individual, colourful.

Cube brand exploration

The problems I worked on:

Creating a strong brand that can be translated across applications from an app to web to a physical product

How much of the original concept should we hold on to? Where is the line between change for good and change for the sake of change? I made these design decisions without emotion or attachment to my work – these decisions need to be made purely for the benefit of the product.

Results achieved:

2. Translate the design language into the app

Instructions received:

As a subset of the original request, this is an implied instruction. I would need to take the initiative to define and complete the task.

The actions I took:

Studied the current app

Printed out every screen of the app, laid them out and thought through the steps of the various user flows

Where is the magic in this app? What’s the killer feature?The main value in this app is integration between devices. The secondary value is seamless control of many types of devices.

How can the killer feature be improved?It should be easier to get devices to work together, the process for setup should be less complicated

How can I use design to encourage the use of this?Use natural language, fill in blanks – don’t have an empty state, let users customize instead of create

How can we reduce the number of clicks?

Where are the interactions long winded?

What can be streamlined?

Which themes can be pulled from looking at the app at this high level?

These themes emerged:

Devices

Device Automations

Collections of devices

This emergence informed the decision making for the app structure. Instead of hiding these important sections behind walls, I chose to have them visible outright.

Sketch out a simplified, improved top level perspective of the IA

Work through the lower level details and user flows – how do they fit into the reshuffled IA

Create a few variations of the “Looks like” for some screens – how could this styling translate to a product in your hand?

Choose a direction based on insight around the “looks like” protoypes, then apply this design thinking to all screens, states and modules in the model

The problems I worked on:

How can we balance the work that I’m proposing with what has already been done?

Where is the optimal level of efficiency in terms of achieving a great experience and having to re-write code unnecessarily

How much of an IA shift can be achieved in a 3 month period?

How can I improve the usability of the killer feature?

Create a natural language interaction model

Results achieved:

Simplified and redefined the IA in a way that worked with the current code architecture

Applied the new brand story to the components of the interface – usually each of these smart devices has an app of their own, and an interaction model of their own. The work done here was to create a unifying language across devices to form one intuitive interface.

Programming IoT devices to work together can get complicated quickly. I was faced with the problem of simplifying this interaction. How can you get a new user to understand how to get their devices to work together? I broke down the problem into a simple, understandable concept: “When something happens, tell my device(s) to do something smart”. With this idea, I created a natural language interaction model. It’s easy to use, since it’s written in English – it makes sense. It’s easy to learn, since the template is there from the beginning. Instead of creating content, the user is editing content and learning very quickly that they can extend this simple model to do much, much more.

3. Translate the design language into the Website

Instructions received:

As a subset of the original request, this is an implied instruction. I would need to take the initiative to define and complete the task.

The actions I took:

Define and consider what the core CTA is? How will this change over time as we transition from pre-launch to kickstarter and beyond?

Sketch out the content of the site

Wireframe the site

Design the site v1

Design review + further design

Development

The problem I worked on:

How do I design and write the code for different versions of the site, even after I leave – pre-launch, kickstarter and launch?

How can I design and develop the site in the scope of the three month project where the app takes a priority seat – what is most efficient use of my time?

Results achieved:

Website designed and developed quickly, within my own strict time constraints

4. Translate the design language into the physical product

Instructions received:

“Work with the physical product design team at MAP – make sure the product stays in line with the new product thinking”

The actions I took:

Attended the meetings

Weighed in on the design decisions

Advocated for the brand language

The problem I worked on:

Translating the core principles of the product into the physical design and packaging

Finding the balance between leading and following the design direction. While MAP was the lead on the physical product design (an excellent group of designers), it was it was my responsibility to ensure that there was cohesion in the nCube ecosystem. It was a great experience to work with them – not only for the physical product, but the overall design benefitted from the interactions with them.

Results achieved:

Worked well with MAP to create a physical product and packaging design that is inline with the brand story and design language

5. Translate the design language into the collateral

Instructions received:

Ongoing small tasks – Create a set of business cards, Create a set of postcards, Create a banner

The actions I took:

Created an asset library of images and vector elements which could be arranged according to the design language and applied quickly into the specified size and format

The problem I worked on:

Lead time on these small tasks was usually incredibly short. Speed, accuracy and scalability were very important here

Results achieved:

A collection of collateral files which can be used again or replicated easily by someone else