top of page
Hub700-hero.png

Lenovo

Leading Lenovo's First Commercial SaaS Offering: ThinkSmart Hub 700

2016 - 2019  |  Lead Designer

As the world's largest PC company, Lenovo launched adjacent solutions for the enterprise space starting with office collaboration devices.

I led the design of our first hardware & software solution including UX, UI, and User Research. It was the first time Lenovo developed a HW+SW solution from 

Business Objective

Lead the launch of Lenovo's next Billion-Dollar business in Smart Office solutions including hardware, software, and services.

Design Objective

Provide design leadership across all products and experiences to get this new business off the ground and achieve revenue milestones.

csm_good-design-award-2019-01_d1b6d0d1d0.jpg
csm_2019_DC_RD_9d88b2617d.png
if_designaward2020_red_l_cmyk.jpg

WHY I CAME TO LENOVO

2016

I joined Lenovo to take on the challenge of turning an idea into a new business opportunity. My responsibility was to lead a new emerging business called Smart Office which focused on dedicated collaboration devices for the workplace. Working closely with the Next UX team, we brainstormed, ran workshops, reviewed competitor products, analyzed market trends, interviewed customers, and finally, designed the solution we knew would transform the collaboration industry.

We started with this question:

What do our customers actually want to do?

MARKET & USER RESEARCH

We visited several customers to listen to their pain-points, view their workspaces and technologies, observe their ways of working, and most importantly, identify their needs.

We can always solve issues, but our goal was to identify the correct ones.

From MK Smart Office Roadmap and Positio

Image Description: This was a photo of one of our customer's conference rooms. It's common to see various technologies, cables, devices, and information placards taking up most of the table.

We compared these learnings with our market research data. We found that companies were looking to improve their conference room experience and invest heavily in it over the next 5-10 years. Meeting room frustrations remained one of the top issues for office productivity and we wanted to find a way to solve it.

We also found that companies were looking to invest in smaller rooms called huddle rooms. These intimate workspaces were more popular than large conference rooms that are rarely fully occupied.

mrd1.PNG
1.jpg

Our focus was to provide the best holistic user experience to our customers. This meant that hardware and software had to seamlessly work together which also meant they had to be designed together.

This was the first time Lenovo would design the hardware and software together from the beginning. Our next step was to figure out how we would actually do it.

My role was to lead the design and strategy from idea to production.

The challenge was that this was new territory for Lenovo and I was literally on my own.

IDEATION

In the beginning, we explored several ideas using all sorts of mediums: white boards, sketching, prints, Post-its, videos, word play, charades - anything that could get ideas flowing and discussions moving.

THE GOAL

During our brainstorm sessions, our main goal was to establish our MMF list for Gen1. There were so many features we could cover, but we knew we had to focus on simplicity and evolve from there.

Here was our criteria:

  • What was critical to the success of this project and how would we measure it?

  • What features could we roll out as Over the Air (OTA) updates instead of squeezing it into Release 1?

  • What would make the rest of the industry nervous if we solved it?

2.jpg

LO-FI PROTOTYPING

From wireframing to mock-ups, I generated hundreds of layouts, grids, and frameworks focused on minimizing user friction and designing for the most common use cases. I knew that if we could predict what users would do most of the time, it would boost their positive experience with the product.

I studied several interaction models and created more than 10 different working prototypes for both internal review and external user studies.

The biggest challenge was designing for a large display that would be several feet in front of the user. It was similar to navigating a streaming service on a family room TV. We would need to design the experience to scale across different formats and form factors.

SO_Proto-A.gif
SO-Proto-B.gif

FORMATIVE USER TESTING

Next, I took my prototypes on a roadshow and ran demos for internal stakeholders, large enterprise customers, and formal user research participants. We gathered feedback on our product definition, MMF feature list, and recorded any specific use cases or environmental constraints we hadn't considered before.

SO-UX Day.jpg

1: FORMAL USER TEST

In April 2017, we ran an in-depth 15 person user research study to get initial feedback on the product, the user experience, workflows, features, and value proposition. It was conducted as a mixed methods, Talk Aloud, task-based study with SUS and NPS.

20170427_120852.jpg
20170426_163551.jpg
20170501_102251.jpg
20170426_092527.jpg
Project Kick-Off

Participants​ were asked to comlete a series of tasks without instruction, using a mouse and keyboard for navigation while viewing the interface from a large display placed at an appropriate distance from them. We tested legibility, workflows, errors, and had participants walk through what steps they expected to perform the tasks.

Participants varied in experience with collaboration tools and online meeting platforms such as Slack, Skype, and WebEx. Most worked in office settings where they were expected to share content remotely at least 3-5 times a week.

We achieved an 88 SUS score in our test, which was one of the highest scores we've ever recorded. We were now ready to pitch our idea to leadership for investment.

PROJECT KICK-OFF

Over the next few months, I demoed the software prototype to several key executive stakeholders across Hardware and Software Development, Strategy, Research, Investment, Operations, and Customer Experience.

 

In September 2017, we received official approval for the project and off we went. A couple of days later, I flew to Yokahama, Japan to formally start the project. Over the next several months, I designed the entire software platform focusing on core design principles and keeping the customer at the center of my design process.

2018-10-03-SmartOffice_Columbia-Updates_

It would be an understatement to say that

designing this software was difficult.

HARDWARE LIMITS SOFTWARE

A simple way to describe the job is that I had to design every feature that Skype and Zoom could do, but I could only use two buttons to do it. This was because we decided on overly simplified hardware controls. The idea was to mimic the iconic interface of the iPod to reduce user confusion and place the user's attention towards the front of the screen during the meeting.

Lenovo ThinkSmart Hub700 mid.jpg
Lenovo ThinkSmart Hub700 HID.jpg

The hardware was designed with the focus of "making meetings simple."

With a powerful i5 Intel processor, an array of mics and sensors, high-quality LEDs, and premium Dolby Voice Audio, the ThinkSmart Hub 700 is one of the most powerful and premium conference room devices in the market.

PROJECT SCOPE

Based on the project definition, we knew we needed a full turnkey solution.

2017-12-14-Columbia_Use_Case-01-04.png

For software, there were four main components:

1. Room User Interface

(application on the hardware)

2. Companion App

(application on Windows client devices such as PCs)

3. Companion App

(application on Android client devices such as mobile phones)

4. Administrative Management Console

(web-based management platform)

I led the strategy, design, and implementation of all these products.

ADMIN CONSOLE

Device deployment, management, and maintenance would be driven by an administrative management console built on a web-based platform. The Portal provided device customization parameters, meeting and device telemetry, and customer account information including billing and licensing.

We agreed to start with Boostrap libraries and a prefab template to meet the aggressive timeline and our MMF Release 1 scope.

2019-02-21-Smart_Office_Award_Images11.p
Admin_Console4.PNG
Admin_Console3.PNG
Admin_Console2.PNG

THINKSMART MANAGER

After Release 1, I was in charge of scaling the detail of this Admin Portal to a new suite of Cloud-based enterprise products under a new Cloud portfolio. Visit my case study on ThinkSmart Manager to see how I redesigned this product, launched a new Enterprise Design System, and helped build Lenovo's Cloud Services.

DETAILED DESIGN WORK

I knew we had to make this product look as elegant and refined as the rest of our Think portfolio so I concentrated my effort on a few screens that would be used the most.

I focused on the following:

1. My preliminary wireframes and prototypes

2. Corporate branding guidelines

3. Market and customer data

4. UX research study results

5. Fundamental UX Design Principles

2017-10-24-SmartOffice_Columbia_Framewor

I spent the very first day doing lots of math.

I used a 4K HD resolution canvas and created my column-grid structure to fit within the pixel constraints. I used a 4 column grid with 2 half columns on each side nestled within equal outer padding. I wanted to ensure that the last CTA was visible enough so users would know content existed beyond the visible interface.

This screen shows the number of connected content and a preview of that content. I also needed to ensure the text was visible from several feet away and the contrast was acceptable by users with vision impairements.

I ran multiple calculations to ensure all the content would fit within the grid and confirmed the app would scale, adapt, and respond correctly across various display resolutions and devices. I tested these with several monitors we had in our lab and in several of the conference rooms on-site.

Next, I designed several frameworks to see if the grid would hold up for all our use cases.

2017-10-25-SmartOffice_Columbia_Calendar

The most important factor to the grid was ensuring proper legibility at various sizes and distances from the display since this interface would be displayed on a large TV in a room.

It was easy to test this by projecting the UI on a room display and letting users read the content at different locations and distances from the TV. I used anthropometric data to define the distance of readability and compared the results to several literature reviews and human factors guidelines and standards.

2017-10-24-SmartOffice_Columbia_Framewor

THINKSMART HUB 700 TEASER

Here is a short video I created of designing the calendar view for ThinkSmart Hub 700.

WIREFRAMES & WORKFLOWS

I sketched out several wireframes to ensure that I incorporated all the features and content correctly then used them across workflow maps and user flows to map out various use cases and user behaviors. I spent months discussing the various use cases in detail and then used that list to serve as our SW feature backlog.

I ran through the use cases many times to test the logic and map