關於富鼎先進

富鼎先進電子股份有限公司1998成立於台灣，總部位在新竹，2009年於台灣上櫃，是一間擁有25年資歷的半導體廠牌。

其所生產之電子元件、電晶體，常見應用在汽車、顯示器、計算機、新能源等，提供電子商品完整的解決方案，富鼎先進現為台灣半導體廠效電晶體（MOSFET）製作規格最齊全的廠商，未來有望在新興的電動車、替代能源市場展露頭角。

富鼎先進與許多上市櫃網站面臨到相同的問題，相同時代背景下製作的網站，如今許多功能已不敷使用，本次的網站重置，夏木樂與富鼎先進整理出了四個大方向，分別是外觀設定、產品篩選器、網站路徑重新分類以及更簡便的財報系統。

方向一、外觀設定

大約五成的網站外觀設計，發想時都是從「企業代表色」開始的，富鼎先進就是其中之一。

富定先進的企業代表色為「藍色」，在舊官網中，我們可以看到這個藍色除了在Logo中出現之外，也有淺淺的被應用在Navi Bar以及選單，但都是以小範圍、塊面的方式呈現。

在新網站的製作上，我們總共提出了三個版本的設計。

前兩版的商品資訊會在Hover時出現藍色的底色，並將產品插畫的線條反白，有鑒於富鼎先進每一個產品家族的規格多元，最終討論並不希望以特定插畫綁定產品的外貌，因此決定以實體照片為主、文字為輔來呈現此區塊。

藍色從以前的小小用10%，變成大大用100%，大面積的主色渲染也使得網頁視覺更佳流暢。

方向二、篩選器優化

舊網頁雖然已有篩選器，但篩選器的邏輯存在著不符合直覺、不夠細節等缺點。

針對篩選器，直覺式設計

延續舊網站的橫向設計，將增加的篩選條件作向右延伸，數字的選擇方式以拉霸代替點擊。另外，每當點選新篩選條件，網頁會自動更新為符合最新條件的結果頁面，不需要再手動按下確定，能讓造訪者更精準查詢符合自身需求的產品。

針對篩選器細節

如果擔心拉霸拉出的數值不準確，拉霸上方的數字欄位可以手動輸入，我有提到篩選的數字單位可以到小數點後兩位嗎？對沒錯，就是小數點後兩位。

下載產品資訊部分，除了基本的分開選擇每項產品的Datasheet、Package、Merge下載之外，也可以把條件設定好，選擇多項產品一次下載。

方向三、網站路徑重新分類

我們的PM為網站主將所有頁面由大脈絡至小分類，重新規劃路徑，像會自動分類的存錢筒，讓造訪者汲取資訊更快速。

試想，要找79元零錢，在一個零錢堆滿滿的小豬撲滿裡找比較快呢？還是在便利超商分類好的POS機裡找比較快呢？

方向四、更簡便的財報系統

財務報表透明化，也是新興概念ESG的一部分，一般而言，上市櫃公司會為此於網站中開設「投資人專區」，或稱「投資人關係」，投資人的功能是為了方便公司財務上傳資料，以及幫助投資人希望快速查找並比較公司財務表現。

夏木樂特別為上市櫃公司設計了簡便的財報系統，財務人員在後台首先以年度及語言開新頁面，新增當季度數據後，即可一併在相同頁面上傳當月營收摘要報告、合併年報、個體財報、法說會資訊的PDF檔，增加工作效率。

投資人則可以在比較完數字之後直接按下營收報告下載，不需跳頁，不需要東找西找，為投資人省去不少麻煩。

總結

富鼎先進這次的案件，可以總結成三點:

第一，是在「不刪減網站元功能」的條件下，重新分類路徑及重新設計外觀，為網站帶來大幅度的加分效果。

第二，是在商品規格多、類別龐雜時，有效運用「篩選器」整理產品資訊，幫眼睛減壓。

最後則是用最淺顯易懂的邏輯製作網站的後台，幫助生成企業財報頁面，打造友善的投資人至專區。

夏木樂個別為這三個面向設計了適合富鼎的解決辦法，如果你也有類似的網站問題，或追求類似的網站效果，歡迎點擊下方連結，讓夏木樂為您量身定制最適合您的上市櫃企業官網。