WHAT WE DO

網站設計需要團隊

但要喝一杯牛奶 不用養一頭牛

好的網站不僅是要有優質的形象。

我們將致力於行銷和良好的網站體質,確保您的網站達到Google SEO的高標準。

更整合各部門的專業領域,為您的網站提供高效能的支援。

我們的服務團隊

Service Icon 01 Service Icon 02

專案企劃Project Manager

協助釐清企業DNA,規劃網站架構,網站策略擬定

Service Icon 01 Service Icon 02

UI/ UX 網頁設計師Desiger

視覺設計、插畫設計、UX動線規劃、RWD視覺規劃

Service Icon 01 Service Icon 02

前/後端工程師 F2E/Backend Engineer

RWD 網站切版、JS特效、API串接、 特殊需求功能開發、後台開發、前端資料串接

SERVICE PROCESS

網站設計服務流程

1.溝通了解需求
在開始網站設計之前,了解網站需求的原因至關重要。 這有助於我們確定優先事項,解決現有問題,並創建一個滿足所有目標的網站。

2.繪製心智圖
為了確保我們能夠滿足您的需求,我們將根據您提供的信息來規劃網站的架構圖, 並設計網站地圖(sitemap)。 這將包括各個單元的分類層次和內容安排,確保網站結構清晰,方便訪客導航。

3.資料匯整
為了確保您的網站能夠達到預期的效果,我們需要您提供相關素材和參考資料。 這些素材將幫助我們更好地理解您的需求,並為您創建一個滿足所有目標的網站。

4.繪製wireframe線框稿
主要目的是溝通網頁的架構、內容、功能、行為、資訊階層。 會用非常簡單的灰階顏色、線條、符號或框線,來表達網頁(或應用程式)的排版架構。
1.溝通客戶想要的風格調性
在開始網站設計之前,您能為我們提供較為喜歡的網站風格設計 並提供網址,讓我們設計師更為清楚設計方向。

2.繪製首頁提案
UI/UX設計師執行首頁視覺設計,先依照客戶喜歡的案例,用不同的設計方式 為您提出樣式首頁提案約二至三種(視專案為定)。

3.繪製整體提案
確認首頁風格之後,UIUX設計師其餘單元視覺設計,並提案設計平面圖 平面圖確認再往下進行。
1.前端工程師切版
前端工程師根據UI/UX進行切版。 編寫html、css、js等語言, 將平面的設計圖轉換成網頁語言及運用特效讓訪客有良好的瀏覽體驗。

2.後端工程師編寫網頁程式
後端工程師根據網站資料內容,設計資料庫欄位與模組的搭配選用, 以不同欄位設定形式,讓新增/修改/刪除/複製資料變得更加快速。

3.後台管理介面匯整
前端所有資料設計完成後,會提供一個方便您自行維護的管理介面,簡稱後台。 在使用的過程會協助您建立數筆資料,並提供完整教育訓練,往後即可自行管理。
1.測試站架設
正式上線前會先架設一個測試網站,並在測試站進行教育訓練, 或者除錯。

2.測試週期
測試站架設之後,會提供一段周期給您讓人員去不斷測試,體驗 過程中去發現有無任何的錯誤產生,有任何的問題可以立即修正。

1.網域確認
一般都需要一個屬於您的網域名稱,例如 www.supernet.com.tw 若是沒有也可以由我們幫助您代申請。

2.主機確認
客戶可以使用自己慣用的主機系統,而我們採用的是亞馬遜主機系統。

3.SSL確認
只要未裝SSL憑證的網站,Google瀏覽器上都會被列為不安全網站。 Google希望能夠透過網站加密與第三方認證的方式,降低有害網站、釣魚網站的危害。 傳統的未加密網站連線協定(HTTP)就會被認定為不安全的網站。
RWD響應式網頁設計

WORK PROCESS

網站設計服務流程

Process Line
Process 01
網站企劃

在開始網站設計之前,
了解網站需求的原因至關重要。

Process 02
視覺設計

確認首頁風格之後,
設計師進行視覺設計,並提案設計平面。

Process 03
程式設計

前端工程師根據UI/UX進行切版。
後端工程師根據網站資料內容,
設計資料庫欄位與模組。

about3

Design & Branding — Web Development — Product Design —

Mobile Application — Web Application — SEO Optimization -

RWD響應式網頁設計

6 大設計要領運用

結合設計思考和數據分析,精確了解市場趨勢和客戶需求,

制定更有效的銷售和市場策略,從而增強品牌競爭力。

創新銷售策略

客戶導向設計

使用者體驗優化

1

清晰簡潔的佈局

簡潔設計:避免過多的裝飾元素,確保界面整潔明了

留白運用:適當使用留白提高內容的可讀性和視覺舒適度。

邏輯結構:設計直觀的佈局,使用戶能快速找到所需信息。

2

一致性視覺風格

統一配色:保持整站一致的配色方案,增強品牌識別度。

統一字體:使用統一的字體和排版風格,確保視覺的一致性。

品牌識別:維持品牌元素的一致應用,增強品牌形象和信任度。

3

RWD響應式設計

多設備支持:確保網站在各種設備(如手機、平板、桌面電腦)上均能良好顯示。

彈性佈局:使用彈性網格和響應式圖片,保證內容在不同屏幕上自適應顯示。

觸控優化:針對觸屏設備進行優化,提升用戶操作體驗。

4

清晰簡潔的佈局

直觀導航:設計簡單明了的導航欄,讓用戶能輕鬆找到需要的頁面。

清晰標籤:使用明確的標籤和面包屑導航,提高用戶的操作便捷性。

搜索功能:提供強大的搜索功能,幫助用戶快速找到相關信息。

5

快速加載速度

圖片優化:壓縮和優化圖片,減少文件大小,提高加載速度。

源管理:運用瀏覽器緩存和CDN(內容分發網絡)來加速頁面加載。

6

清晰簡潔的佈局

價值內容:提供有價值且易讀的內容,滿足用戶需求。

視覺元素:結合高質量的圖像、視頻和圖表,增強內容吸引力。

結構清晰:使用清晰的標題、段落和列表,使內容易於瀏覽和理解。