為您的應用程序設計一個有吸引力且可用的數據導入器

這篇文章得到了我們在 Flatfile 的親愛的朋友的大力支持，他們創造了以人為中心的美好體驗，以消除人與數據之間的障礙。 謝謝！

如果您以前曾嘗試將數據導入應用程序，那麼作為用戶，您就會知道體驗的多樣性。 在某些情況下，用戶對如何使用導入器的說明感到不知所措。 在其他情況下，根本沒有方向。 雖然這可能看起來比導入器溢出的說明和如何使用它的文檔鏈接更好，但一旦不可避免的錯誤開始拋出，一個完全無用的 UI 也會讓用戶感到沮喪。

那麼，當您設計需要數據導入器的應用程序或軟件時，您如何確保最終用戶不會發生這種情況？ 您是否嘗試自定義構建或找到在最小和信息之間取得適當平衡的 Goldilocks 解決方案？ 那甚至應該是什麼樣子？

今天，我想看看四種方法來確保您的數據導入器的用戶界面設計不會妨礙積極的用戶體驗。

開始之前的快速說明：我將使用實時數據導入器示例來演示如何自行設計。 但是，如果您只想使用現成的數據導入器，但沒有時間根據這些良好的設計實踐查看現有選項，那麼 Flatfile Concierge 就是您要找的。 隨著我們的進行，我將展示一些例子，並在本文末尾告訴你更多關於它的信息。

軟件數據導入器的 UI 設計技巧

應用程序和軟件的數據載入存在許多挑戰。 但是，如果您可以正確地獲得 UI — 換句話說，為您的最終用戶提供一個有吸引力且可用的導入器 — 您可以有效地減少這些挑戰。

如果您想為您的用戶實現這一點，您的數據導入器應該如下所示：

1. 格式化說明的可讀性

數據導入過程有多簡單並不重要。 您永遠不能假設您的最終用戶會自動知道如何格式化他們的文件、允許哪些文件類型以及可能存在什麼樣的文件大小限制。

因此，主要的進口商頁面必須有他們的說明。 只是要小心過火。

如果你給他們留下一堵解釋進口商用途的文字牆，他們會對阻礙他們開始的冗餘信息感到惱火。 而且，如果您詳細說明每個可能的步驟，他們的眼睛就會呆滯。 在最壞的情況下，他們會開始體驗感覺好像他們正在被說服。 這些結果都不是理想的。

要找到最佳位置，請瞄準以下目標：

將說明簡化為 100 字或更少。

PayPal 的發票導入器就是一個很好的例子：

此頁面上有一個段落告訴用戶文件需要：

• 為 CSV 格式；
• 包括電子郵件地址、項目名稱和發票金額的字段；
• 包括不超過 1000 張發票。

對於任何錯過文件格式的人，他們會在上傳字段中得到提醒。

其餘信息（文件模板的鏈接和關於如何批量開發票的常見問題解答）鏈接到其他頁面，這使這個導入器頁面保持美觀和簡短。

如果可能，我建議使用段落、項目符號、粗體標題或空白來格式化說明。 這類似於您在網頁或應用程序頁面上為可讀性而構建文本的方式。

QuickBooks Self-Employed 向我們展示了這可能是如何工作的：

提出了三個步驟，每個步驟都保持簡短和重點。 通過在它們之間和周圍添加額外的空間，閱讀導出/導入說明似乎不那麼令人生畏。

您可以做的最後一件事是突出“導入”按鈕，以便多次使用導入器的用戶可以快速跳過後續使用的說明。

如果您使用 Flatfile 作為數據導入器，這可能是這樣的：

該按鈕在此頁面上清晰可見。 對於那些以前使用過這個導入器的人來說，他們不需要通讀右邊的說明來提醒他們允許什麼樣的文件類型。 按鈕下方有一個說明，說明了這一點。

更重要的是，該按鈕位於左上角，這是大多數用戶最初關注新頁面的地方。 因此，按鈕的強烈顏色加上優先放置將幫助用戶快速啟動導入過程。

2. 向他們展示所有可用的導入選項

消費者通常希望公司為他們提供選擇。 這是我們最近在電子商務中經常看到的情況，購物者希望有各種可用的購買選項（例如店內提貨、路邊提貨、兩天交貨等）。

如果這樣做對您的應用有意義，請考慮為您的用戶提供同樣的靈活性並控制他們導入數據的方式。 當你這樣做時，設計每個選項，以便清楚地看到它 - 只需查看它 - 接下來會採取什麼行動。

例如，這是 AND.CO 的費用和收入進口商：

帶有虛線邊框的塊告訴用戶他們至少有一個選項：將他們的 CSV 文件拖放到要上傳的小部件中。 雖然像這樣的進口商設計並不總是允許點擊上傳，但這個（根據說明）。

Flatfile 在導入頁面頂部使用了類似的設計：

這兩個示例之間的區別在於，Flatfile 在虛線框內包含一個上傳按鈕，因此很明顯兩個導入選項都可用。

此塊下方還有第三個選項：

如果您的最終用戶將返回導入器以添加少量數據並且不想每次都準備文件，那麼包含手動導入選項是一個好主意。

呈現導入選項的最後一種方法是像 Asana 那樣使用第三方軟件徽標：

頁面頂部提供了標準 CSV 文件導入選項。 然而，在這之下，是用戶最有可能存儲項目數據的應用程序。

如您所見，導入選項的視覺呈現與提供的說明一樣重要。 因此，與其嘗試在這裡發揮創意，不如使用最終用戶熟悉的久經考驗的設計，並幫助他們立即確定他們喜歡的導入選項。

3. 讓複雜的導入看起來簡單

在數據導入過程的這個階段，事情可能會變得有點棘手。 即使您在後端有一個完美的導入過程，如果過程的複雜性開始顯現出來，它呈現給最終用戶的方式可能會成為問題。

您可以對 UI 做兩件事來防止這種情況發生。 這一點將涵蓋如果導入過程本身很複雜，您可以做什麼。

HubSpot 是一款功能強大的營銷和銷售軟件，因此數據導入過程需要一段時間也就不足為奇了。 無論如何，它開始很簡單，詢問用戶是否要導入他們的數據或從另一個平台提取數據：

現在，這個設計與我剛才談到的關於設計第一頁的最後一點相反。 但是，這是一個不錯的選擇是有原因的。

假設這個 HubSpot 用戶決定從 CSV 文件導入他們的數據。 他們會選擇“導入”，然後轉到此頁面：

如果 HubSpot 使用典型的導入頁面設計，該頁面將需要用戶暫停，然後熟悉新界面，然後再繼續。

因此，如果您有一個複雜的數據載入流程，需要在實際導入開始之前將其分解為多個步驟，則需要考慮這一點。

假設用戶只想導入 CSV、XLS 或 XLSX，他們接下來會發現自己在這裡：

這種方法的好處是它可以防止用戶必須為他們必須上傳的每個文件都通過導入器一次。 如果有相關數據，他們可以選擇“具有關聯的多個文件”，導入器將幫助他們建立這些連接：

這樣，合併文件中的數據不是用戶的責任。 他們也不必花費數小時查看導入的記錄來合併相關記錄。 這個進口商幫助他們做到這一點。

下一個屏幕類似於“您要導入多少文件？” 屏幕。 但是，當用戶選擇“一個文件”時，會出現這個：

這再次旨在防止用戶導入數據，然後花費過多的時間來清理它。

接下來，我們有用戶最終看到導入器的部分過程。 雖然它與我們之前看到的設計不完全一樣，但它仍然足夠直觀，用戶可以知道如何將文件上傳到其中：

雖然我意識到進入其他軟件首先顯示的頁面需要很多步驟，但想想這些用戶能夠以多快的速度進入 HubSpot 並開始工作。

如果您有一個複雜的上傳過程（即多個文件、對象關聯等），請考慮使用類似的設計，每個問題都在其自己的頁面上以及一致呈現的選項。

4.使用顏色使數據清理速度更快

另一種簡化原本複雜的導入過程的方法適用於所有數據導入器。 特別是，此提示與數據載入過程中的最後步驟有關：

• 數據驗證
• 數據清理

現在，擁有一個可以實際完成其中一些工作的數據導入器將是一個巨大的幫助。 但是，最終由您的最終用戶來審查他們導入的內容並在他們允許將其放入軟件之前對其進行批准。

為了幫助他們不要被所有數據和他們需要解決的所有事情壓得喘不過氣來，請使用顏色來引導他們完成它。

對於此示例，我們將查看 ClickUp。 如果它看起來很熟悉，那是因為它應該。 它是使用 Flatfile 的數據導入器構建的。

讓我們從數據驗證過程的第一部分開始：

這個頁面很簡單。 它向用戶顯示他們導入數據的片段，並詢問他們指向的行是否包含列名。

但是看看綠色的“是”按鈕。 雖然這是我們用於 Web 和應用程序界面的設計策略（即，使所需的號召性用語成為積極且引人注目的顏色），但這裡還有另一個原因。

假設列名存在並且 ClickUp 可以輕鬆解釋數據，這就是用戶接下來看到的內容：

這是數據導入者嘗試輕鬆地進行數據驗證的嘗試。 左側是文件中所有已識別的列。

右側是有關列如何與 ClickUp 的字段匹配的信息。 還有三種可能的數據驗證選項：

1. 確認映射（綠色） ；
2. 忽略此列（在灰色幽靈按鈕中）；
3. 包含為自定義字段（在另一個幽靈按鈕中）。

這裡的綠色按鈕與我們在最後一個屏幕上看到的相匹配。 因此，用戶已經習慣於將此綠色按鈕視為肯定，這將幫助他們快速瀏覽所有結果並確認正確匹配的字段。

綠色和灰色不是應該出現在數據導入器中的唯一顏色。

如果出現錯誤（這不是一件壞事），您的用戶應該有機會在數據上傳之前修復它們。 根據錯誤出現在應用程序中的位置，您可能希望以不同的方式設計它們。

例如，ClickUp 使用橙色警告符號來指出驗證期間的值問題：

這允許 ClickUp 告訴用戶，“是的，列名匹配，但您的值與我們使用的不一致。”

ClickUp 然後在數據清理期間使用紅色熒光筆指出字段錯誤：

這是上傳前的最後一步，因此這是 ClickUp 讓用戶完善數據導入的最後一次嘗試。 在這種情況下，如果某個字段標記為必填但不包含數據，則 ClickUp 會以紅色突出顯示該字段。

僅顏色就應該引起對字段的注意。 但是，如果用戶導入了一個包含數百或數千行的文件並且第一眼看不到紅色怎麼辦？ 讓他們在這些紅線上歸零將是非常有價值的。

而 ClickUp 的“僅顯示有問題的行”切換執行此操作：

讓我們面對現實吧：除非您的數據導入器告訴您的用戶他們的數據何時何地出現問題，否則他們可能不會再看一眼。 也就是說，直到他們在軟件中並且想知道為什麼他們的記錄都搞砸了。

當然，他們會把它歸咎於進口商和軟件； 不是他們自己的疏忽。 因此，在整個過程中提供這些彩色標記將是一個巨大的幫助。

包起來

正如我之前提到的，如果您不確定自己可以在構建無摩擦和無錯誤的數據導入器之間實現棘手的平衡，同時將其設計為有吸引力、直觀和有用，那何必費心呢？

正如我們已經看到的，Flatfile Concierge 是一個現成的數據導入器解決方案，它不僅可以處理各種數據導入場景，而且看起來也很棒。 通過讓它為您的數據導入流程提供支持，您可以將更多時間用於構建產品，您的客戶可以將更多時間用於為他們的用戶提供更好的客戶服務和支持。