Timeline: May 2019 – July 2019
Role: Product Designer
Tools: Sketch, GitLab
Field: IT Infrastructure, Virtualization, Enterprise Cloud

时间：2019 年 5 月 – 2019 年 7 月
角色：产品设计师
工具：Sketch、GitLab
领域：IT 基础架构、计算虚拟化、企业云

From understanding and defining problems, designing prototypes and visual interactions, to working with engineers to improve products, I stayed in close contact with the team throughout the process. The project team consisted of 2 back-end engineers, 3 front-end engineers, 1 test engineer and 1 product manager. In addition, I also communicated with the after-sales technical support team.

从了解和定义问题、设计原型和视觉交互，到与工程师合作以完善产品，我在整个过程中都和团队保持密切的联系。这个项目的团队包括 2 名后端工程师、3 名前端工程师、1 名测试工程师和 1 名产品经理。此外，我还与售后技术支持团队沟通。

Project Background and Problems
项目背景和问题

The IT Migration Process for Enterprise Customers Is Not as Simple as Expected

企业客户的 IT 迁移过程不像预期那样简单

Corporate customers will create and use virtual machines on SmartX software products after purchasing them. If a customer believes that the products perform as expected within a certain period, they will gradually migrate more or even all virtual machines from the old virtualized computing platform to SmartX platform.

企业客户在购买 SmartX 公司的软件产品后，会在其上创建并使用虚拟机。如果客户认为产品在一定周期内的表现符合预期，就会陆续将更多甚至全部虚拟机从旧的虚拟化计算平台迁移到 SmartX 的平台。

However, virtual machine migration is a challenge for both corporate customers and SmartX’s after-sales team. Because there is no specialized tool for the migration operation, each step needs to be performed manually, which is tedious, time consuming and prone to errors. The virtual machine may eventually need to be shut down before the migration starts, thus affecting the business.

但是，虚拟机迁移对企业客户和 SmartX 公司的售后团队来说，都是一项挑战。因为迁移操作没有专门的工具，每个步骤都需要手动执行，过程繁琐，耗时较多，还容易出错，并且在迁移开始前就必须关闭虚拟机，业务会因此受到影响。

Whether the migration is easy will also affect the purchasing decision of corporate customers and the cost of after-sales service. Therefore, a specialized tool is urgently needed to help make the migration of virtual machines easier.

而迁移是否容易，会影响企业客户的购买决策，和售后服务的成本。因此，急需一个专门的工具来帮助简化虚拟机迁移。

Measuring Success
衡量成功

Easy-to-use Graphical Tools Can Make the Migration Easy

简单易用的图形化工具让迁移变得轻松

Our goal is to provide a graphical tool to help simplify the migration process. This tool includes the following features:

我们的目标是提供一个图形化的工具，以帮助简化迁移过程。这个工具包含如下特性：

  1. Simple graphical interface, obvious or predictable operation process. This will change the purely manual operation process and reduce the possibility of operation errors;
  2. A more efficient data transfer method (full snapshot + incremental snapshot) is used. This will change the shutdown time point of the virtual machine, shorten the window, and minimize the loss of business caused by migration;
  3. Has extendibility to support possible future product routes, such as allowing seamless bidirectional migration of virtual machines between SmartX platform and public cloud, private cloud and other virtualization platforms. It will make the structure of the tool more robust and easier for customers to make purchase decisions because good virtual machine mobility can avoid “platform locking”.
  1. 具有简易的图形界面、显然或可预期的流程。这将改变纯手工操作流程，并减小操作出错的可能性；
  2. 使用一种更高效的数据传输方式（全量快照 + 增量快照）。这将改变虚拟机关闭的时间点，并缩短窗口期，最大限度地减小迁移对业务造成的损失；
  3. 具有可扩展性，以支持未来可能的产品路线，例如允许虚拟机在 SmartX 平台和公有云、私有云及其他虚拟化平台之间无缝双向迁移。这将使该工具的结构更健壮，并使客户更容易做出购买决策，因为良好的虚拟机移动能力可以避免“平台锁定”。

Among the three features above, the second one is dominated by back-end engineers. As a product designer, I mainly focus on how this new technical solution is integrated with the product.

其中，第 2 点特性是由后端工程师主导的。我作为产品设计师，主要关注这种新的技术方案如何与产品融合在一起。

MVP
最小可行产品

Journey Map and Prototype: Hypothesis Verifiers

可以帮助我们检验假想的用户体验地图和原型

This is a very specialized tool used by frontline after-sales technical support personnel, and I have no previous experience of migrating virtual machines across platforms. Therefore, I must fully understand the previous operation methods and the reasons for each step of operation, as well as think about what all these processes should present itself in a graphic software application.

这是个身处一线的售后技术支持人员使用的非常专业化的工具，而我之前没有跨平台迁移虚拟机的经历。因此，我必须向他们充分了解之前的操作方式，以及每一步操作的原因，并思考全部这些过程在图形化软件中应当是怎样的。

Journey Map

用户体验地图

Based on information obtained from documents and interviews, I have explored the original work flow. I tried to integrate it into a framework that conforms to human intuition and establish a process suitable for graphical software operation.

我根据从文档和访谈中得到的信息，探索了原始工作流程。我试图将其整合进符合人类直觉的框架之中，形成一个适用于图形化软件操作的流程。

Prototype

原型

I have drawn a simple prototype of the interface according to the process defined by Journey Map. Since I need to verify this plan with my colleagues in the after-sales technical support department, the plan must not only be quickly formed to save time, but it also has to be intuitive so that my colleagues can fully understand what I mean.

根据用户体验地图定义的流程，我绘制了简单的界面原型。因为我需要向售后技术支持的同事验证这个方案，所以方案必须快速成型以节省时间，但又要看起来直观，这样同事们才能充分理解我的意思。

First of all, I will provide 3 main pages. Depending on whether or not the migration task has been completed, there are the “In Progress” and “History” pages, as well as the “Sites” management page.

首先，我将提供 3 个主要页面。按照迁移任务是否已经结束，分出“任务队列”和“历史记录”页面，此外还有“站点”管理页面。

Users can create migration tasks on the “In Progress” page under the premise that there are 2 existing sites that can migrate virtual machines to each other before the migration task can be created.

用户可在“任务队列”页面创建迁移任务。但前提是，需要先存在 2 个可以互相迁移虚拟机的站点，才能创建迁移任务。

Adding a site on the “Sites” page. You may ask, why not start a migration task directly and connect the source side and target side at the same time? The reasons for this are as follows: 1. To support the reuse in a better way and provide convenience; 2. To prepare in advance to ensure the site is available and the operation process is stable; 3. To not restrict a site as the source side or target side, leaving room for extendibility (any site may be either side in the future).

在“站点”页面添加站点。你可能会问，为什么不直接开始一项迁移任务，同时连接源端和目标端站点呢？这样做的原因有：1. 更好地支持复用，提供便利性；2. 提前准备以确保站点可用，稳定操作流程；3. 不限定一个站点是源端或目标端，留有可扩展性（未来任一站点都可能是任意一端）。

The migration task consists of 4 simplified steps.

迁移任务包含经过简化的 4 个步骤。

Step 1: Select the source side and target side for migration;

第 1 步：选择迁移的源端站点和目标端站点；

Step 2: Select one or more virtual machines to be migrated and add to the migration task;

第 2 步：选择需要迁移的一个或多个虚拟机，以加入迁移任务；

Step 3 and step 4: Select the virtual network mapping relationship and storage policy on the source side for the virtual machine.

第 3 步和第 4 步：为虚拟机选择在目标端的虚拟网络映射关系和存储策略。

The created migration task, including one or more virtual machines, will be displayed on the interface. Migration of each virtual machine can be paused, continued and stopped.

创建完毕的迁移任务，包含一个或多个虚拟机，显示在界面上。每个虚拟机的迁移，都可以被暂停、继续和停止。

Virtual machines that have completed migration will be moved to the “History” page. Here, you can also view the completed timeline and migration details.

已经完成迁移的虚拟机将会被移动至“历史记录”页面。在这里，也可以查看已经完成的时间线和迁移的详细信息。

At the same time, I have come up with some questions and hope to ask my colleagues in the after-sales team in the later verification phase. For example:

同时，我有一些疑问，希望在之后的验证环节询问售后团队的同事。例如：

  1. Since the migration process is relatively long, is it necessary to add a timer start function to help users allocate time reasonably?
  2. Is it necessary to add a rate restriction function to ensure that network resources will not be excessively occupied by migration operations?
  3. Is it necessary to design the installation and deployment? If the software can be pre-installed on the computers of the after-sales personnel, will the operation time in the customer company be shortened?
  1. 既然迁移的过程是比较漫长的，那么是否需要提供定时开始的功能，来帮助使用者合理分配时间呢？
  2. 是否需要提供限速功能，以保证网络资源不会被迁移操作过多地占用？
  3. 是否有必要对安装部署进行设计？如果能将该软件预先安装在售后人员的电脑上，是否就可以缩短在客户公司里的操作时长？
Internal Feedback
内部反馈

Think Outside the Box and Correct Inappropriate Practices

跳出既定思维和修正不合实情的做法

In an attempt to verify my plan with busy after-sales colleagues, I made an appointment with the leader of the team for half an hour after a full team meeting to collect feedback from each of them as much as possible. The back-end engineers of the R&D team also joined me in the meeting.

为了与繁忙的售后同事验证我的方案，我和该团队的 leader 预约在一次团队全员会议后的半小时的时间，以尽可能收集他们每个人的反馈。研发团队的后端工程师也和我一起参加。

After discussion, I got a lot of useful feedback.

经过讨论，我得到了许多有用的反馈。

  1. If the transmission process cannot be unattended, a timer start will be meaningless.

    Since a “timer start” will not actually help due to the need to manually shut down the source side virtual machine during the migration process, and the fact that that the task may encounter other problems, which makes it impossible to be completely unattended, the idea was rejected.

  2. It is necessary to add a network rate restricting function, but someone wishes that the network rate does not get restricted.

    Create an input box to enter the desired rate restriction and set it to optional.

  3. Corporate customers usually do not allow after-sales personnel to bring their computers into their computer room because of security considerations.

    Therefore, the software must be installed on the computers of corporate customers, and then the after-sales personnel shall assist in the operation. The software deployment will be an inevitably repetitive operation. So I will provide a process arranged in the simplest way possible during the initial configuration phase.

  4. The structure of “one migration task containing multiple virtual machines” is somewhat redundant, and it is easier to simplify it to “each virtual machine is a migration task”.

    In the end I accepted the proposal. “Adding multiple objects to one task” is a continuation of the “snapshot schedule” in the company’s flagship software, but the reason is that there are a large number of scheduled tasks and a scheduled task needs to protect the whole group of resources at the same time. There is some correlation between the resources of this group. Therefore, I further inquired the after-sales team and learned that the number of virtual machines migrated at the same time would not be more than 10, and they should all be in the same direction, thus I came to the conclusion that the original structure was somewhat redundant. There is no correlation between each virtual machine.

  5. After the migration of virtual machines is completed, do not set automatic boot on the target side site, because some configuration has to be made to ensure that there are no conflicts between IP addresses.

    Instructions shall be clearly provided on the interface.

  6. The after-sales team expects that a regular mail notification will be provided, however, the nature of the demand is to provide predictability of time.

    We ultimately rejected the mail notification method because the investment in configuring mail notification was not commensurate with the actual benefits. We will display the predictable remaining time to provide predictability and meet the nature of demand.

  1. 如果传输过程不能做到无人值守，则定时开始没有意义。

    由于迁移过程中需要手动关闭源端虚拟机，而且任务还可能遇到其他问题，无法做到完全无人值守，所以“定时开始”并不能带来实际帮助，这个设想被否定。

  2. 需要提供网络速率限制功能，但也有人希望不做限制。

    可提供一个输入框来输入期望限制的速率值，并设为可选。

  3. 企业客户通常不允许售后人员带电脑进入企业机房，这是出于安全性考虑。因此，必须将软件安装在企业客户的电脑上，再由售后人员协助操作。

    软件的部署将是不可避免的重复性操作。因此我将提供一个在初始配置环节尽可能简单的流程。

  4. “一个迁移任务包含多个虚拟机”的结构有些冗余，简化为“每个虚拟机都是一个迁移任务”会显得更简单。

    最终我接受了这个提议。“在一个任务中添加多个对象”，这是延续了公司主打软件中“快照计划”的做法，但原因是计划任务的数量较多，且一个计划任务需要同时保护其中成组的资源，这组资源之间是有某种关联的。于是我进一步询问售后团队，得知同时迁移的虚拟机数量一般不会超过 10 个，且都是同方向的，由此可以判断原结构有些冗余。并且，每个虚拟机之间不存在关联性。

  5. 虚拟机迁移完成后，在目标端站点上不要自动开机，因为通常要进行一些配置，以确保 IP 地址不会发生冲突。

    需要在界面上明确地提供说明。

  6. 售后团队希望有定时邮件通知，但需求的本质是提供对时间的可预测性。

    我们最终否定了邮件通知的方法，因为配置邮件通知的投入和实际收益不相称。我们将显示可预估的剩余时间，以提供可预测性，满足本质需求。

These suggestions are closely related to front-line business. Although they broke my assumption to some extent, they have also simultaneously improved my design efficiency and confidence. I need to make further optimization on these suggestions.

这些建议与一线业务紧密相关，虽然它们在一定程度上打破了我的假设，但提升了设计效率和信心。我需要针对这些建议做进一步的优化。

Plan Optimization and the Completion of Design Draft
方案优化和设计稿制作

Design a User-friendly Pixel-perfect Interface for the Improved Plan

为改进的方案设计用户友好和像素完美的界面

Since there was no major structural problem, I started working on the high-fidelity interface after quickly adjusting the details.

由于没有较大的结构性问题，我在快速调整细节后，开始高保真界面的制作。

I had tried many different interface layout designs. In the end, I put my mind to one of them, because its layout is the same as the company’s main software (which is also the most familiar to users) “Web Console”, which can reduce the cognitive cost of users, make them feel familiar with it and can get them started in no time. At the same time, in order to prevent the users from feeling overwhelmed when they are unable to create a blank page for the migration task after logging in to the software, I provided conspicuous operation instructions at the center of the default page.

我尝试了多种不同的界面布局设计。最终我选择了其中一种，因为它的布局和公司的主要软件（也是用户最为熟悉的）“Web 控制台”相同，可以降低用户的认知成本，使用户感到熟悉，并能快速上手。同时，为了避免用户登入软件后，面对暂时无法创建迁移任务的空白页面感到不知所措，我在默认页面中央提供了醒目的操作指引。

I designed icons for each page. For “In Progress”, I tried two plans. Circling graphics may bring anxiety, while timers are more stable and can be quickly understood by users.

我为每个页面设计了图标。对于“任务队列”，我尝试了 2 种方案。转圈的图形可能会带来焦虑感，而计时器则更稳定，而且能被使用者快速领会。

The “History” page adopts the clock icon and I combined it with the “List” icon. The “pushpin” icon on the “Sites” page vividly expresses its meaning. The graphics of server host or cluster is not adopted to represent “Sites” because the concept of “Sites” here may be different types of objects, such as public cloud in addition to local server cluster or the vCenter Server.

“历史记录”页面继承了时钟的符号，再和“列表”符号结合。“站点”页面的“图钉”符号则形象地表达了它的意思。没有采用服务器主机或集群的图形来代表“站点”，是因为此处的“站点”概念可能是不同类型的对象，例如除了本地服务器集群或 vCenter Server 外，还可能是公有云。

In the first step of creating the migration task, I added the function of network rate restriction and used the more commonly used unit in network management, i.e., Mbps, instead of MiB/s for disk data rate. I was challenged by some colleagues who were proficient in data storage. After a quick communication with our after-sales colleagues, we made this decision clear, because the restricted value was limited by the network administrator and was only related to the network, not storage.

我在创建迁移任务的第 1 步添加了网络速率限制的功能，并使用网络管理的常规单位 Mbps，而非磁盘数据速率的 MiB/s。有精通数据存储的同事向我提出质疑。在和售后同事快速沟通后，我们明确了这个决定，因为限制的值是由网络管理员限定的，只与网络有关，而与存储无关。

In step 2 of creating the migration task, virtual machines were allowed to be retrieved by cluster or host, and the specific reasons were displayed for virtual machines that could not be migrated currently. The estimated values of storage and memory usage were also provided to reduce the possibility of operational errors.

在创建迁移任务的第 2 步，允许按集群或主机来检索虚拟机，针对当前无法进行迁移的虚拟机，显示具体原因。并提供了存储和内存占用的估算值，以减小操作出错的可能。

Steps 3 and 4 were to set up network mappings and storage policies.

第 3 和第 4 步则是设置网络映射和存储策略。

Since the level of migration tasks is optimized, each virtual machine migration is now a separate task, which is only displayed on the interface according to the migration direction. This is to eliminate redundancy while maintaining order. The task cards will be sorted by the priority level to ensure that users see the tasks they need to deal with first.

由于优化了迁移任务的层级，现在，每项虚拟机迁移都是独立的任务，只是在界面上会按照迁移的方向来分区显示而已。这是为了在消除冗余的同时仍保持秩序。任务卡片将会按照重要程度来排序，以确保用户能最先看到到需要他们处理的任务。

Tasks have different states. Due to the data transmission method of “full snapshot + incremental snapshot”, it is necessary to shut down the virtual machine at the source side site after the full snapshot transmission accounting for a large proportion is completed, while the remaining data needs to be transmitted in the form of incremental snapshot. I provide operations at different points in time by changing the contents of the card, whereas users only need to focus on the current operations.

任务有不同的状态。由于采用了“全量快照 + 增量快照”的数据传输方式，在完成占大比重的全量快照传输后，需要在源端站点关闭虚拟机，并以增量快照的形式传输剩余数据。我以改变卡片内容的方式来提供不同时间点的操作，用户只需要关注当前的操作。

After the migration task is completed, the user will be explicitly prompted that the virtual machine will not boot automatically. Manually confirmed completed tasks will be moved to the “History” page.

迁移任务完成后，用户会得到明确的提示，被告知虚拟机不会自动开机。手动确认完成的任务将会被移动至历史记录页面。

Finally, I designed a simple initialization configuration process for the migration tool. This software will be copied to the customer’s enterprise equipment by after-sales personnel, and will run after a simple initial configuration.

最后，我为迁移工具设计了简单的初始化配置流程。这个软件将会由售后人员拷贝至客户的企业设备上，然后在简单的初始化配置后就开始使用。

Optimization During the Development Process
开发过程中的优化

Handle Unpredictable Edge Conditions in the Design Process

处理设计过程中无法预知的边缘状况

A front-end engineer told me that when selecting a virtual machine in the step 2 of creating a migration task, it would take some time to query the storage and memory data of the virtual machine, and the estimated value would not be refreshed immediately, possibly resulting in a very short delay.

前端开发人员告诉我，在创建迁移任务的第 2 步选择虚拟机时，查询虚拟机的存储和内存数据需要一定时间，预估的数值将不能立即刷新，可能有非常短暂的延迟。

I am not sure if it is necessary to set a friendly prompt of “Loading…” for the short delay, because it may bring very subtle feeling.

我不确定是否需要为短暂的延迟设置“加载中…”的友好提示，因为它带来的感受可能是非常微妙的。

Hence, I built the prototype of the operational experience in a very short time. Please visit https://codepen.io/lujw/pen/wvBoBXy to experience it. After comparing these experiences, I decided to add a brief status prompt because it can provide an immediate feedback.

于是，我快速构建了可操作体验的原型。你可以访问 https://codepen.io/lujw/pen/wvBoBXy 来体验。通过体验比较，我决定为数据显示添加短暂的状态提示，因为它能立即提供反馈。

Self-reflections
感言

Actively Shared Information and Presented Ideas in Team Collaborations

在团队协作中积极共享信息和展示想法

Sometimes, product designers will “work behind closed doors”. It’s great to have a keen sense of perception, but this project particularly requires a full understanding of the status of front-line work. It gives me the opportunity to put the verification process as far ahead as possible. In fact, I learned a lot of useful information through interviews early in the original process stage. This process has been extremely helpful, allowing me to try and correct mistakes in the early stage, hence improving the overall efficiency.

有时，产品设计师会“闭门造车”。拥有敏锐的感受力是很棒的，但这个项目尤其需要充分了解一线工作的状况，它给了我一次机会，让验证环节尽可能前置。事实上，早在原始流程阶段，我就通过访谈了解到了许多有用的信息。这样的过程实际上产生了巨大的帮助，让我在前期就可以试错并迅速修正，提升整体效率。

The experience of this project makes me think that engaging in ample communication is a very joyful thing. It can keep information flowing and is greatly conducive for team collaboration.

这个项目的经历让我觉得充分沟通是一件非常快乐的事。让信息保持通畅，对团队协作有巨大的助益。