---
title: "Vital CRM App - Neil 的作品集"
description: 業績提升、增加回購率及熟客經營最佳首選。
canonical_url: "https://neillin.com/products/vital-crm-app/"
meta:
  author: Neil
  keywords: "CRM, 客戶關係管理系統"
  "og:description": 業績提升、增加回購率及熟客經營最佳首選。
  "og:image": "https://neillin.com/images/vitalcrm-app-thumbnail.webp"
  "og:title": "Vital CRM App - Neil 的作品集"
---

> Index of every page on this site: [llms.txt](https://neillin.com/llms.txt)

:::

# Vital CRM App

![Vital CRM 客戶關係管理系統 App](https://neillin.com/images/vitalcrm-app-thumbnail.webp)

*Vital CRM 客戶關係管理系統 App*

## 概要

Vital CRM 是一款專為中小企業量身打造的雲端顧客關係管理系統。2014 年推出新版 App，設計首重於使用者在戶外跑業務時，如何迅速找到客戶、記錄拜訪重點、行事曆管理以及處理後續任務。

  

### 目標

- 改善舊版使用套件預設的 UI 樣式導致產品沒有個性、操作不符合內容類型以及適逢各行動裝置尺寸的興起。
- 增進主管管理、業務外出使用的便利性。
- 引進設計流程。

### 角色

- UI
- UX
- 切版

### 工具

- 紙與筆
- Illustrator
- Sketch app
- 4ourth Mobile Touch Template

## 過程

### 研究

- 快速且輕易地尋找目標人物。
- 要比舊版更好的填寫紀錄。
- 新增任務系統。
- 新增分享系統(地點、留言、任務/約會與會議)。
- 研究當時各種行動裝置尺寸、使用者操作模式以及可觸及範圍，作為日後設計版面之依據。
- Functional Map、UI Flow 以及 Wireframe
- 既要符合現有產品的視覺規範與個性，且還要盡量遵循 iOS 與 Android Guideline
- 使用者經常在外奔波，操作範圍要大且符合情境操作，例如機/汽車、單/雙手、點/握/拿...等。
- 資訊量龐大，不作無謂裝飾，聚焦於資訊呈現簡單易懂。

## 產出

![functional map 和 wireframe](https://neillin.com/images/vitalcrm-app-wireframe.webp)

*functional map 和 wireframe*

![Vital CRM APP 重點截圖，使用手機通常使用單手/握，所以重要操作置於中央與下方（列表、功能按鈕以及快捷按鈕），次要操作（搜尋、選單以及修改）放置於較上方，且均符合當時作業系統版本的 Guideline。針對左右手操作距離都相等，只有快捷按鈕偏右側（但符合作業系統 Guideline）。](https://neillin.com/images/vitalcrm-design-mobile.webp)

*Vital CRM APP 重點截圖，使用手機通常使用單手/握，所以重要操作置於中央與下方（列表、功能按鈕以及快捷按鈕），次要操作（搜尋、選單以及修改）放置於較上方，且均符合當時作業系統版本的 Guideline。針對左右手操作距離都相等，只有快捷按鈕偏右側（但符合作業系統 Guideline）。*

![Vital CRM APP (Tablet) 重點截圖，平板打橫可操作範圍較直式的區域廣。另外，因為中央區域會變得比較難按到，所以會把需要專注且較花時間的操作，放在靠近中央區域（因為此時操作情境偏向較常使用單手/點/放置平穩的模式），例如：編輯客戶資料。如果只是瀏覽資訊，情境會變成雙手/握/拇指滑動，會盡量靠近兩側可滑動區域。](https://neillin.com/images/vitalcrm-design-tablet.webp)

*Vital CRM APP (Tablet) 重點截圖，平板打橫可操作範圍較直式的區域廣。另外，因為中央區域會變得比較難按到，所以會把需要專注且較花時間的操作，放在靠近中央區域（因為此時操作情境偏向較常使用單手/點/放置平穩的模式），例如：編輯客戶資料。如果只是瀏覽資訊，情境會變成雙手/握/拇指滑動，會盡量靠近兩側可滑動區域。*

## 相關連結

### 網站

1. [Apple Store](https://apps.apple.com/us/app/vital-crm/id932283661 "(另開視窗) 前往  Apple Store")
2. [Google Play](https://play.google.com/store/apps/details?id=com.gss.videgreeapp2&hl=zh_TW&gl=US "(另開視窗) 前往  Google Play")
3. [Vital CRM](https://www.gsscloud.com/tw/vital-crm "(另開視窗) 前往  Vital CRM")

```json
{"@context":"https://schema.org","@graph":[{"@id":"https://neillin.com/#website","@type":"WebSite","inLanguage":"zh-Hant-TW","name":"Neil 的作品集","url":"https://neillin.com/","workTranslation":{"@id":"https://neillin.com/en/#website"}},{"@id":"https://neillin.com/products/vital-crm-app/#webpage","@type":"WebPage","description":"業績提升、增加回購率及熟客經營最佳首選。","name":"Vital CRM App","url":"https://neillin.com/products/vital-crm-app/","isPartOf":{"@id":"https://neillin.com/#website"},"potentialAction":[{"@type":"ReadAction","target":["https://neillin.com/products/vital-crm-app/"]}]},{"@id":"https://neillin.com/#person","@type":"Person","jobTitle":"UI/UX 設計師","name":"Neil Lin","url":"https://neillin.com/","sameAs":["https://github.com/Neil-Lin"]},{"@id":"https://neillin.com/products/vital-crm-app/#/schema/creative-work/1","@type":"CreativeWork","dateModified":"2025-08-06T00:00:01.000Z","datePublished":2014,"description":"業績提升、增加回購率及熟客經營最佳首選。","inLanguage":"zh-Hant-TW","keywords":"CRM, 客戶關係管理系統","name":"Vital CRM App","url":"https://neillin.com/products/vital-crm-app/","author":{"@type":"Person","name":"Neil Lin"},"image":{"@id":"https://neillin.com/#/schema/image/1"}},{"@id":"https://neillin.com/products/vital-crm-app/#/schema/breadcrumb-list/1","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"回首頁","item":"https://neillin.com/"},{"@type":"ListItem","position":2,"name":"產品","item":"https://neillin.com/products/"},{"@type":"ListItem","position":3,"name":"Vital CRM App","item":"https://neillin.com/products/vital-crm-app/"}]},{"@id":"https://neillin.com/#/schema/image/1","@type":"ImageObject","contentUrl":"https://neillin.com/images/vitalcrm-app-thumbnail.webp","inLanguage":"zh-Hant-TW","url":"https://neillin.com/images/vitalcrm-app-thumbnail.webp"}]}
```

## Sitemap

See the full [sitemap](https://neillin.com/sitemap.md) for all pages.