他們的挑戰
在推出他們的新產品後銷售就緒網站2017 年底，Intech® 與 New Breed 合作，在 HubSpot CMS 上創建了一個互動式網路工具，可用於視覺化和比較每日和時間序列數據，顯示 20 多個股票市場的壓 南非電話號碼數據 力水平世界。 Intech® 將能夠將此工具用於以下兩個方面潛在客戶世代和銷售支援。其網站的訪客可以監控該工具以深入了解股市風險，並可以訂閱接收有關監控器的季度報告。他們的客戶關係經理可以幫助客戶了解當前市場風險背景下的投資組合表現，因為該工具旨在輕鬆地視覺化內部市場壓力演算法。
在發布之前，Intech® 發布了 Intech Market Equity Stress Monitor TM（該公司對股票市場壓力的專有觀點）（後來的版本）的靜態季度摘要。但他們真正想要的是他們網站上的互動式版本的監視器。為了實現此類專案所需的高水準開發和集成，Intech® 團隊決定利用 New Breed Marketing，HubSpot 的鑽石級代理商夥伴，使這個項目成為現實。
我們的動態流程
1. 導入和集成
我們流程的第一步是與Intech 的交易團隊合作，每天早上將21 個股票市場指數（包含在105 個CSV 檔案中）從Intech 的內部系統傳送到其HubSpot 檔案管理器中，以根據前一天的數據更新該工具。
在交易團隊的幫助下，我們建立了一個工作流程HubSpot 的 FTP（文件傳輸協定）每天早上啟動傳輸的服務。在較高層面上，HubSpot 的 FTP 允許用戶在本地系統和 HubSpot 的伺服器之間傳輸文件，這使得團隊可以每天早上將包含股票市場指數資料的 CSV 文件路由到文件管理器中。
上傳後，這些檔案就成為 Intech Market Equity Stress Monitor TM顯示的可用資料。如果沒有 HubSpot FTP，我們將無法整合 Intech® 的交易系統和 HubSpot 入口網站並啟動其股票市場指數資料的每日檔案傳輸。這會使顯示器不斷過時。
2. 編碼和開發
一旦所有必要的數據都存在於 Intech® HubSpot 入口網站中並每天更新，我們就準備好開始開發監視器本身。文件傳輸只是團隊面臨的挑戰的開始設計和開發這個市場監視器。為網頁瀏覽器開發動態和互動式資料視覺化是一個困難的過程。從較高的層面來看，我們面臨的挑戰如下：
每個頁面元素都需要在使用者與其互動後立即更新。最重要的是，它需要 顯示正確的數據點。
每個指數的股市壓力數據都有不同的開始日期和頻率，需要擴展、整合到單一工具中並清晰呈現。
顯示器必須能夠在所有現代設備上工作網路瀏覽器。
最重要的是，為了獲得最佳的用戶體驗，該工具需要盡可能靠近單個頁面顯示，這意味著必須在很小的空間內編譯大量訊息，同時仍然易於理解且美觀。
為了最好地實現這一目標，我們的團隊使用了 JavaScript 庫 D3.js（資料驅動文件），這使他們能夠利用現代 Web 瀏覽器的全部功能並突破動態視覺化經常面臨的限制。一個JavaScript 函式庫是一組預先編寫的 JavaScript 函數，可以整合和自訂以擴展 CMS 的本機功能。 D3.js 函式庫是同類中最好的，專門幫助建立使用該工具時看到的互動功能：
僅當滑鼠懸停在索引圓圈上時才會出現的箭頭和資料。
一次最多可以選擇 3 個索引。
能夠變更使用日期選擇器選擇的日期或透過將趨勢線拖曳到新日期。
我們選擇 D3.js 函式庫是因為它有完整的文件記錄並且適用於所有 Web 瀏覽器 - 這意味著 Market Equity Stress Monitor TM及其互動功能將為所有使用者正確顯示和更新。它還允許：
能夠將包含市場指數資料的 CSV 檔案對應到視覺化；
趨勢線、箭頭和點的互動式動畫；和
根據使用者選擇不同的市場指數和日期進行回應更新。
很少有函式庫能夠實現所有這些動態資料視覺化，而能夠在所有 Web 瀏覽器上正常運作的函式庫就更少了。如果沒有 HubSpot FTP 和 D3.js JavaScript 程式庫，專案將無法滿足 Intech 的要求。
我們必須克服的最後一個障礙是標準化我們從所有市場指數中提取的資料類型。每個股票市場指數都有不同的初始開始日期和更新頻率（有些是每天更新，有些是每週更新），沒有一個在周末更新。
這增加了獲得不匹配的第三層難度數據建立一個標準尺度，以直觀地表示市場監測中的指數，而不會出現偏差。兩個團隊都經歷了漫長的過程，以確保監視器每次都能正確顯示所有數據。這是 Intech® 的首要任務，因為他們需要確保顯示器不會混淆或誤導用戶數據他們正在觀看。
3. 設計
這設計監視器的內容盡可能減少，因為它呈現的資料是主要焦點。單頁限制增強了對緊湊設計的需求，因此我們必須確保充分利用有限的空間。
這裡最重要的是，我們的設計清楚地傳達了用戶可用的各種選項，以及每個選項如何協同工作以最好地可視化資料。我們使用編號圖示來顯示使用者應採取的步驟，並盡可能包含指導性標籤來引導使用者與工具互動。
結果
在密集的開發衝刺結束後，Intech Equity Market Stress Monitor TM於 2018 年 1 月 16 日成功推出。訪客使用該監視器來深入了解市場風險以及如何補充標準投資行業風險衡量標準。最後但並非最不重要的一點是，Intech Equity Market Stress Monitor TM還融入了他們的內部演算法，為產品提供了真正的增值，使其不再只是紙帶的複製。
具體來說，股票市場壓力監控器TM是一個客製化集成，利用HubSpot CMS、HubSpot FTP 和 D3.js API。這證明了您可以將 HubSpot CMS 推向多遠，因為我們的團隊實際上正在 Intech® 網站中開發了一個小型 Web 應用程式。以下是 Intech® 對此專案的評價：
