motionboard design handbook - wingarc

MotionBoard Design Handbook

WingArc1st Inc.

Customer Success Department

Copyright © 2019 WingArc1st Inc. All Rights Reserved.


INDEX

1. Introduction

What you can do on MotionBoard

2. Board design

What kind of board will you create to make who do what?

3. Presenting information

How to design and use graphs

4. MotionBoard features

Introduces functions often used on MotionBoard

5. Troubleshooting

Contact our Support Site

1.

Introduction


Users introduce MotionBoard to their operations because they have a goal in mind.

However, when they use it, they might encounter the following scenarios:

“I don’t know how to express this.”

“I made a graph, but I’m not sure what to do next.”

“I created a board, but not many people use it.”

This handbook was created to help you avoid similar issues when using MotionBoard.

1. Introduction

1.

Introduction


Creating a board Establishing usage

Data is available but it is difficult to use

I don’t know how to use

MotionBoard

Use frequency within the company does not

increase

Designing a board Data-related Acquisition ∙

Processing Organization

I don’t know how to express information

This handbook aims to eliminate obstacles in board design within the MotionBoard creation and deployment cycle.

Data is available but it is difficult to use

1. Introduction

MotionBoard creation and deployment cycle

1.

Introduction


Unfortunately, visualization on MotionBoard does not always equal action.

Visualize data

I want viewers to look at the board, notice something…

and take action

1. Introduction

1.

Introduction


Even if you want someone to notice something, they may not notice some things easily.

When creating a board, consider what you want viewers to notice and what you want them to do.

Visualize data

1. Introduction

What you want to do on MotionBoard

Notice xx

… and take action

What you want to show with MotionBoard

I want viewers to see xx by

looking at a board…

…and to then take action

2. 4 steps of board design


1. Clarify the purpose and objectives of your board

2. Select the information you want to show

3. Determine the layout

4. Decide how you want to show information

2. Board design

1. Clarify the purpose and

objectives of your board


I have some information I want to visualize but...

I don’t have a clear idea about how to do it

I don’t know where to start

I don’t know how to construct it

In these situations, start by organizing your requirements.

2-1. Clarify the purpose and objectives of your board

1. Clarify the purpose and objectives

of your board

To create a board that makes viewers aware of particular conditions and changes behavior...

Know your audience

・Who are the viewers?

・What do they want to know?

・What is the priority of the required information?

・What kind of expressions will be easy to understand?

Set the objectives of your board

・What you want to express to the users?

・What you want users to do after viewing a board?

What do you want them to do after viewing a board?


What do they want to know?


Who are the viewers?

What do you want them to notice?

2-1. Clarify the purpose and



Before creating a board, first determine its purpose. Use the Board Design worksheet below to organize your board’s purpose.

If you receive requests such as “I want to view xx”, but are unsure of what to do when the image on the screen is unclear, of what additional information you need and why, or what action you want viewers to take after viewing a board, then follow these steps to organize your requirements.

What you want to communicate the most using the board (what you want viewers to notice)

Arrange and set the priority order for the things you want to know

1.

2.

3.

What the viewer wants to know What you want the viewer to do after viewing the

board

KPIs

Use Scenario Details: Frequency:

Viewer’s Role

Viewer


2-1. Clarify the purpose and



Record what the viewer wants to know. Then decide the priority and order of the content.

Viewer

Group Manager

Sales department staff

Viewer’s Role

Achieve group/individual targets

Use Scenario

Details: Group meeting Frequency: Once a week

KPIs

Achieve budget $500,000

What the viewer wants to know

Can the budget be achieved?

What kind of projects there are.


How much is still needed to achieve targets?

Can they be achieved with current

prospects?

What you want the viewer to do after viewing the board

Make decisions about what they need to do to achieve the target.

(For example: Decide which prospective projects they need to focus on. Conduct activities to increase projects and so on.)


1. Current target status I want to see current totals, including orders and prospective projects, and how they compare to targets.

2. Can targets be achieved at current pace? I want a forecast for the end of the term, while also viewing the progress of current projects.

3. What kind of prospective projects do we have? Which projects do we need to take to achieve targets? I want to check at the line level.


Reference: Sample order

of priority


Ask the viewer to decide the priority order or use a worksheet like the one below. If you set the vertical and horizontal axes when deciding the order of priority, it will help you determine where to place your organized content.

Example: Setting priority order

2- 2. Select which information to display


Once you have organized your requirements on the Priority Setting worksheet, select the specific information you want to display.

It will be easy to understand if you write it concisely on a sticky note.

Viewer’s Role Achieve group/individual targets

Use scenario Details: Group meeting Frequency: Once a week


Can the budget be achieved? What kind of projects there are?

Arrange and set the priority order for the things you want to know 1. Current target status

I want to see current totals, including orders and prospective projects, and how they compare to targets.

What you want the viewer to do after viewing the board Make decisions about what they need to do to reach the target.

(For example: Decide which prospective projects they need to focus on Conduct activities to increase projects)

Viewer Group Manager Sales department staff

What you want to communicate the most using the board

(what you want viewers to notice) How much is still needed to achieve targets Can they be achieved with current prospects

2. Can targets be achieved at current pace?

I want a forecast for the end of the term, while also viewing the progress of current projects.

2-2. Select the information you want to show

3. What kind of prospective projects do you

have? Which project do we need to take to

achieve targets? I want to check at the line level

Achieve budget $500,000

Target / Actual orders / Achievement rate / Difference

Progress in orders and prospects

Project details

2-4. Decide how you

want to show information


Decide what to put where. You can also add information if it is not enough.

Think about the layout from the perspective of the viewer and place important information based on the order the viewer

would want to know it or in the order that would be easy for the viewer to understand.

*Place the sticky notes you made in Step 2.

2-3. Determine the layout

2-4. Decide how you

want to show information


Think about how you want to display information.

Decide the size of the placement.

Refer to the chart features pages that follow for more information. The more important the information is, the easier it should be to understand.

2-4. Decide how you want to show information

Exam

ple


You can view the current situation and prioritize future activities

Should you focus on the remaining prospects? Or increase the number of projects?

I want to know the current situation

→ Stacked column

I want to see progress

quickly →Details graph

Details

I want to know the difference between

actual orders and targets numerically →Spreadsheet

Example

3. Presentation (Graph)

features)


1. Stacked column chart 2. Spreadsheet

Which chart is easier to understand?

Example: Prospects for the target

3. Presenting information (Chart features)


features)


1. Stacked column chart

A chart that is easy to understand varies depending on the viewer and the situation.

Use charts and spreadsheets according to the situation, such as who will be viewing it and what you want to convey. You can also use a combination of these as needed.

2. Spreadsheet

See the exact figures


View a situation at glance

See the exact figures


features)


Total comparison by item

Column chart

Total for each summary item and the ratio of the category items to the total summary

Stacked column chart

Changes in the total value and ratio of category items over time

Stacked column area

Percentage of the total

Pie chart

Line chart

Distribution of data

Heat map

To identify which chart is easier to understand, you need to appreciate the features of each.

Charts allow viewers to intuitively see changes and percentages. Use a chart to highlight the information you want to know the most.

Changes over time


3. Presentation (Chart features:

reference)


Examples of charts that WingArc 1st uses.

Target and performance results

Stacked column chart (Advanced version)

Target : Gray background Prospects: Blue to red stacked column chart * The lower the placement, the higher the order probability.

Placing the target on a gray background lets you easily see how many prospects you have towards your target.

Target and PPL progress Stacked area chart and line chart

Target : Blue line Prospects : Blue to red stacked column chart * The lower the placement, the higher the order probability.

You can easily see daily changes in the status of prospective orders. Displaying the target as a line chart makes it easy to see the difference between the target and actual orders.

Coverage status Heat map

View the status of introduction by comparing industry × sales volume * Increased coverage is identified in red.

It is easy to identify which key elements should be focused on among lot of information.


3. Presentation (Visual guidance

principle)


• Visual hierarchy principles

Z-pattern: From left to right, then top to bottom, and left to right

F-pattern: From left the right, and returning to the left, then one step down and another sweep to the right

It’s easy to guide a person’s line of sight with a vertical board. *You can do this using Free Layout Mode

Arrange information while keeping the flow of the viewers’ line of sight in mind.

3. Presenting information (Visual hierarchy principles)

3. Presentation (Overall design)


• Aesthetic appeal

Use margins to align items

Use a uniform font

• Color Use colors to highlight areas that viewers should notice or to assign a particular meaning to an area, but do not overuse. Keep colors uniform throughout the board. Example: MAPPA

Everything is white, black and gray, except the charts

Align chart layout

3. Presenting information (Overall design)

4. MotionBoardfeatures Functions that are even

more convenient than

Excel


MotionBoard has more useful functions than Excel. Here are some examples:

・Snapshot function (data storage)

You can collect data at a specific point in time.

WingArc 1st collects project information every Friday morning, so we can visualize the progress and changes in projects.

You can immediately see changes compared to the information from the previous week.

・Report distribution

MotionBoard can automatically create and distribute board images and specified format files.

You can also specify the delivery time and destination so you can use this function to create daily reports.

・Relation function

By clicking on one chart, you can filter the information displayed on other charts to the relevant information only.

・Load multiple Excel sheets

MotionBoard can treat multiple Excel sheets as one Data Source.

・Additional Item function

You can use items in the Data Source to create new previously unavailable items.

・Distinct count

You can count distinct cases by ignoring data duplication.

4. MotionBoard features

の予算

の予算業部

Excelの複数シート読み込み

複数のエクセルシートを

1つのデータソースとして扱う

第3営業部

第1営

の予算

By using Snapshot, you can visualize changes compared to the information from the previous week.

Press the button to create a PPT with the same image as the board You can set up automatic distribution of the PPT

Relation Function You can filter other chart information from the Information of the element you click.

By using Snapshot, you can visualize the progress and changes in projects

Load multiple Excel sheets Motion Board can treat multiple Excel sheets as one Date Source.

Additional Item function

Create new items that are

unavailable in the original data.

Use cases of Motion Board features

Sales Dept.3

Sales Dept.2

Sales Dept.1

Budget


5. Troubleshooting

Have an inquiry or some feedback for us?

Feel free to contact Global Support team.

mailto:[email protected]%20%[email protected]%3e;

Appendix 1

Board Design Worksheets


Viewer

Viewer’s Role

Use Scenario Details: Frequency:


KPIs

Arrange and set the priority order for the things you

want to know 1.

2.

3.

What you want to communicate the most using the board

(what you want viewers to notice)


Strong← →Weak

＜＞

High ↑

↓

Low

Appendix 2

Board Design Worksheet Example


[Reference] Worksheet usage

example

① Decide the purpose of your board

using the worksheet

s Reserved.

Department Head

Department Management

・ Are overtime hours increasing or decreasing for the department?

・ Which employees might exceed 45 hours of overtime?

・ Overtime status on an individual basis

Which employees have a large number of overtime hours?

Individual management of employees who might exceed 45 hours of overtime

Changes in overtime hours for the department

Are overtime hours increasing or decreasing? When are the busy months?

Status of working overtime beyond 45 hours Who are the employees with more than 45 hours of overtime? Who are the employees who might exceed 45 hours of overtime?

Overtime hours per month

and per individual; overtime status per individual


Board design worksheet example 1.Clarify the purpose of your board using the worksheet

Viewer’s Role

Viewer

Use scenario Details: Personnel management for the department

Frequency: Once or twice a month




1. Changes in overtime hours for the department Are overtime hours increasing or decreasing? When are the busy months? 2. Status of working overtime beyond 45 hours Which employees have more than 45 hours of overtime? Which employees might exceed 45 hours of overtime? 3. Overtime hours per month and per individual Overtime status on an individual basis


example

② Select the information

you want to show

s Reserved.

Viewer

Viewer’s

Role

Use scenario Details: Personnel management for the department

Frequency: Once or twice a month

What you want the viewer to do after viewing the board Individual management of employees who might exceed 45 hours of overtime


・ Are overtime hours increasing or decreasing for the department?

・ Which employees might exceed 45 hours of overtime?

・ Overtime status on an individual basis


Which employees have a large number of overtime hours?


1. Changes in overtime hours for the department Are overtime hours increasing or decreasing? When are the busy months? 2. Status of working overtime beyond 45 hours

Which employees have more than 45 hours of overtime? Which employees might exceed 45 hours of overtime?

3. Overtime hours per month and per individual Overtime status on an individual basis

Overtime hours per month (department average) Comparison information: Previous fiscal year average

Employees with more than 45 hours of overtime

Employees who might exceed 45 hours of overtime

Details of overtime hours per individual Overtime hours per month Instances when overtime hours exceeded 45 hours

Department Head

Department Management

Board design worksheet example 2. Select the information you want to show


example

③ Decide the

layout


Details

What is the status of overtime hours for the

department?

Which employees have a large number of overtime

hours?

The required information you determined in Step 2

What you found to be necessary after placing the sticky notes

Decide what to put where. You can also add information if it is not enough. Think about the layout from the perspective of the viewer and place important information based on the order the viewer would want to know it or in the order that would be easy for the viewer to understand.

*Place the sticky notes you made in Step 2.

Details of overtime hours per individual

・ Overtime hours per month

・ Times overtime exceeded 45 hours

Employees with more than 45 hours overtime

Overtime hours per month (department average) Comparison information: Previous fiscal year average

Overtime hours for the current fiscal year (department average) Comparison information: Same period from the previous fiscal year

Board design worksheet example 3. Determine the layout



example

④ Decide how

you want to show

information


Think about how you want to display information. Decide the size of the placement. Refer to the chart features pages for more information. The more important the information is, the easier it should be to understand.

What is the status of overtime hours for the department? →See the numbers at a

glance →Single chart

Which employees have a large

number of overtime hours?

→Show “who” and “how many times”

→Spreadsheet

Show “who” and “current

status”

→Spreadsheet

Employees with more than 45 hours of overtime


Monthly comparison

(Previous year / current year)

→Column chart

Details of overtime hours per individual

・Overtime hours per month

・Times overtime exceeded 45 hours

Board design worksheet example 4. Decide how you want to show information

Details

→Spreadsheet or details

Overtime hours for the current fiscal year (department average) Comparison information: Same period from the previous fiscal year

Overtime hours (department average) Comparison information: Previous fiscal year average

Inc. All Rights Reserved.

Copyright © 2019 WingArc1st

[Reference] Worksheet usage example Example

Which employees have a large

number of overtime hours?

→Show “who” and “how many times”

→Spreadsheet

Show “who” and “current status”

→Spreadsheet

Monthly comparison (Previous year /current year)

→Column chart

Details

→Spreadsheet

As it is now clear which employees have a large number of overtime hours, the person in charge can manage them accordingly.

List of employees whose overtime exceed 30 hours for the current month

Number of months overtime exceeded 45 hours for the current fiscal year

Board design worksheet example

Average overtime hours for the current fiscal year

27.38hours

Changes in average overtime hours

Average overtime hours for the previous fiscal year

27.83hours

What is the status of overtime hours for the department? →See the numbers at a glance →Single

Month Apr May Jun Jul Total Name Over time working hours

Dept.

Inside Sales 2

Name Name

Total

Inside Sales 1

motionboard design handbook - wingarc

Documents