<p>PM /設計 : 陳怡君</p><p>前端：賴佳毅</p><p>後端：Poga</p><p>資料處理：API + 資料庫</p><p>技術挑戰：優化網站速度</p><p><a href="https://www.tofutype.com/" target="_blank">go to tofutype</a></p><figure><img src="/dataImgs/portfolio/14/01.jpg"></figure><figure><img src="/dataImgs/portfolio/14/02.png"></figure><figure><img src="/dataImgs/portfolio/14/03.png"></figure><div class="grid"></div>

Tofutype 是我們發展第一個產品，讓您可以單字購買，用多少付多少，更符合中文使用習慣。由於中文字量相當大，一套字約 1.5 萬，我們處理資料量級也超過 20 萬等級。

Tofutype 豆腐字販賣所

<figure> <img src="/dataImgs/portfolio/19/01.png"> </figure> <h2> 梓書房 PAPER BOOKS </h2> <h1> 從部落格搬家到訂作的特色二手書櫃 </h1> <p> <a href="https://www.paperbooks.tw/">Website Link →</a> </p> <p dir="ltr"> 梓書房是座落於台中福人街的獨立二手書店，因書店主人選書、收書的獨到品味，以及在書架間穿梭的貓兒，成為熱愛閱讀的文藝讀者們心中，美麗且溫暖的淘書角落。 </p> <p dir="ltr"> 網路書店的網站建置，多以大量販售、電子商城的購物車操作為主，然而，讀者在二手書店更看重的是書店選書的品味眼光，及其經驗老到的尋書門路。與販售新書的書店相比，這些書在來到梓書房的過程也有更多的故事，因此，書店經營的記事也是吸引讀者的亮點之一。原先梓書房以部落格 Blogspot 與臉書作為網路經營的渠道，然而制式部落格有許多功能限制，也較難與讀者互動。 </p> <p dir="ltr"> 因此，透過官方網站的設計，將電子報、與讀者的互動計畫、書籍資訊等加以整合，除了讓品牌形象更完整外，也更便於讀者接收資訊、理解書店現況。 </p> <h2> ｜將焦點留給擅於收書的書店主人 </h2> <figure> <img src="/dataImgs/portfolio/19/02.png"> </figure> <figure> <img src="/dataImgs/portfolio/19/03.png"> </figure> <p dir="ltr"> 極簡的版面配置，節制的配色使用，讓視覺的焦點能夠聚焦於書籍封面，突顯書店主人選書的特色，讓美麗的書籍封面，增加想要收藏書本的感受，彷彿再現書店裡的書櫃。點擊這些書籍封面，則可深入閱讀店主所撰寫的選書訊息。 </p> <p dir="ltr"> 配色僅使用黑白的灰階色調與深淺兩種咖啡色來點綴。雖然是整體而言是簡約的配色，但在各種不同類型的文字資訊，因應資訊的重要程度，使用深淺不一的灰階，在細節製作出舒適的閱讀體驗與層次感。 </p> <h2 dir="ltr"> ｜與讀者更多可能的互動與討論 </h2> <figure> <img src="/dataImgs/portfolio/19/04.png"> </figure> <p dir="ltr"> 絕版付梓則是最能彰顯梓書房特質的計畫。在絕版付梓的頁面中，透過讀者的許願、線上投票，選出自己心目中最想再版的書籍。這些票選雖不能直接等同於再版保證，但或可作為未來再版實踐時的重要參考。 </p> <p dir="ltr"> 透過客製化且簡單的投票設計，增加網站與讀者互動的可能性，同時也可以搭配不同檔期，得以引發話題討論，促進交流，是從部落格到客製網站最為關鍵的轉變。 </p> <h2 dir="ltr"> ｜貓咪與書的日常生活 </h2> <p></p> <p dir="ltr"> 首頁書店日誌，設計為滑鼠移動 hover 到右側不同篇貼文時，左側的照片會因應更換。愛貓的店主人擅長攝影，在她的鏡頭裡得以看見貓咪與書一起生活的日常片刻。因此在這裡的設計，盡可能將這些照片以較大的排版呈現，但同時又不致於過度紛雜，呼應書店寧靜怡人的氛圍，展現貓咪作為梓書房的特色。 </p> <h2> Design Overview </h2> <figure> <img src="/dataImgs/portfolio/19/05.png"> </figure> <figure> <img src="/dataImgs/portfolio/19/06.png"> </figure> <figure> <img src="/dataImgs/portfolio/19/07.png"> </figure> <h3 dir="ltr"> 專案團隊 Team </h3> <p dir="ltr"> 專案管理 | 陳怡君<br> 視覺設計 | Hanyu Chen<br> 前端工程師 | 陳怡婷<br> 後端工程師 | 彭郁斐 </p> <p></p>

透過官方網站的設計，將電子報、與讀者的互動計畫、書籍資訊等加以整合，除了讓品牌形象更完整外，也更便於讀者接收資訊、理解書店現況。

梓書房-官方網站設計建置

<h2 dir="ltr"> <b>需求說明</b> </h2> <p dir="ltr"> 這次來自國家人權委員會的委託，希望能在新的立院會期，提出網站未來發展的方向，改變舊印象，營造新的形象。 </p> <h2 dir="ltr"> <b>中間轉折</b> </h2> <p dir="ltr"> 原本希望可以委託製作完網站的首頁，包含設計與工程，但和資訊部來回後，理解到既有的網站製作廠商的程式寫法，是沒有 API 的作法，也就是外觀與資料庫是黏在一起的，骨肉無法分離，不能只換外觀的皮而已。 </p> <p dir="ltr"> 台灣公部門的網站大多委託資訊部管理，將網站託管在本地端主機，和一般新創公司託管在雲端主機生態不同。政府也建立自己的資安測試，不定期的測試資訊部門的反應，這也是建立在本地端主機的生態下。 </p> <p dir="ltr"> 諸多考量下，仍建議客戶找既有廠商製作網站。對客戶來說，是較佳的解法。我們仍提供設計插圖，可以快速更換印象，達到和立委溝通網站未來發展的目的。 </p> <figure> <a href=""><img src="/dataImgs/portfolio/18/12.png"></a> <figcaption class="align-center"> 現行的國家人權委員會網站截圖（2021/4/27 截取），我們的任務是將其視覺進行老屋翻新工作 </figcaption> </figure> <h2 dir="ltr"> <b>技術新視野 </b> </h2> <p dir="ltr"> 政府和大型企業，提供網站，過往多會買一台主機放置於機房，並組成 MIS 團隊進行部署、上線等工作。 </p> <p dir="ltr"> 開發團隊會將程式碼遞交給機房工程師，再請進行部署、上線。這和雲端環境，由開發團隊自動部署上線的作法相當不同。 </p> <p dir="ltr"> 以客戶角度思量，本地端主機，有以下優勢 </p> <ol> <li dir="ltr">資料放自己家管理，有隱私資料更會傾向放自己家</li> <li dir="ltr">流量再大也不用新增費用，只要多買幾包乖乖的成本</li> <li dir="ltr">資安攻防有既有作法</li> </ol> <p dir="ltr"> 以開發團隊思量，雲端主機，有以下優勢 </p> <ol> <li dir="ltr">開發上線容易，不需要再過一組單位</li> <li dir="ltr">流量再大，雲端主機扛，但要新增費用</li> <li dir="ltr">資安保全由雲端主機配備，不用再煩惱這一塊</li> </ol> <p dir="ltr"> 野薑團隊熟悉處理的是雲端主機的運作方式，然而，若要將網站改為雲端主機，客戶端不只是程式碼編寫會出現問題，還會有組織及流程改動的問題。因此評估之下，認為將設計交付野薑，工程交付給過往提供服務的廠商，將設計與工程的工作切割開來，對彼此來說都是最有益的方式。 </p> <h2 dir="ltr"> <b>溝通文化</b> </h2> <p dir="ltr"> 國家人權委員會辦公室的專案窗口相當有經驗。溝通上過程除了給予明確的指示外，也能清楚將顧慮和感受傳達出來。比如說： </p> <p dir="ltr"> 「 我擔心，這組氛圍抗議太激烈，希望能氣氛緩和，更偏向遊行概念 」 </p> <p dir="ltr"> 「 我擔心，過往身障總是被批評都是接受幫助，希望能朝賦能(empower)方向走」 </p> <figure> <img src="/dataImgs/portfolio/18/01.jpg"> <figcaption class="align-center"> 客戶給予明確的指示文件 </figcaption> </figure> <p dir="ltr"> 這次插畫過程，我們拆分階段為「意象討論」→「草稿確認」→「彩稿細修」→「完稿」。 </p> <h3 dir="ltr"> ○ 意象討論 </h3> <p dir="ltr"> 我們收到一開始的文案是「性別，消除對婦女一切形式歧視公約。實現男女的完全平等，確信一國的充分和完全的發展，世界人民的福利以及和平的事業，需要婦女與男子平等充分參加所有政治、社會、經濟和文化生活等各方面活動。 」 </p> <p dir="ltr"> 在表達這類抽象概念時，我們會提供簡報，說明每一項元素和情緒連結，以及給予人的聯想是那些。這一階段重點是將潛在不適合地元素剔出，尤其注意可能會有公關危機的元素，是這階段溝通重點。 </p> <figure> <img src="/dataImgs/portfolio/18/02.png"> </figure> <div class="grid"> </div> <h3 dir="ltr"> ○ 草稿確認 </h3> <p dir="ltr"> 草稿溝通時會以先前討論過後、確定採納的元素，來進行構圖。窗口若能將草稿給長官確認，可以讓後續不用修改結構。 </p> <figure> <img src="/dataImgs/portfolio/18/03.png"> </figure> <div class="grid"> </div> <h3> ○ 彩稿細修 </h3> <p dir="ltr"> 彩稿交付後可能會有些調整。比如說，希望手有不同膚色，來呈現各種族群的多樣性。畫面的人物所傳達出來的情緒、氛圍等的調整，也會在彩稿時修正。相對於黑白的線稿，彩稿所能傳達的意涵更為完整，因此交付給窗口判斷是否符合專案需要，來進行精細的調整，有助於專案順暢。 </p> <figure> <img src="/dataImgs/portfolio/18/04.png"> </figure> <h3 dir="ltr"> ○ 完稿 </h3> <p dir="ltr"> 彩稿過關後，將插圖放上原先網站的設計稿中，搭配適合的文字和設計，再交付給客戶確認。 </p> <figure> <img src="/dataImgs/portfolio/18/05.png"> </figure> <h3 dir="ltr"> <b>團隊</b> </h3> <p dir="ltr"> PM | 陳怡君 </p> <p dir="ltr"> 視覺發展 | Hanyu、Si-Ray </p> <p dir="ltr"> 客戶團隊 | 國家人權委員會 </p> <h3 dir="ltr"> <b>首頁模擬大圖</b> </h3> <p dir="ltr"> 此專案仍提供一份模擬大圖，作為未來發展方向建議。 </p> <figure> <img src="/dataImgs/portfolio/18/06.png"> </figure> <p> <b>插畫視覺示意</b> </p> <figure> <img src="/dataImgs/portfolio/18/07.png"> </figure> <figure> <img src="/dataImgs/portfolio/18/08.png"> </figure> <figure> <img src="/dataImgs/portfolio/18/09.png"> </figure> <figure> <img src="/dataImgs/portfolio/18/10.png"> </figure> <figure> <img src="/dataImgs/portfolio/18/11.png"> </figure>

來自國家人權委員會的委託，希望能在新的立院會期，提出網站未來發展的方向，改變舊印象，營造新的形象。

國家人權委員會網站-視覺設計與插圖

<figure> <img src="/dataImgs/blog/37/01.png"> </figure> <p dir="ltr"> 有些小工想要完成，但簽合約費時費力？一開始規劃的需求，和之後有些差異，又要再開包案來處理，有點小題大作。市場好像有變化了，想做一些小測試試... </p> <p dir="ltr"> 這些心聲我們聽到了～野薑推出，節省雙方心力的服務方式 - 彈性時數計費。用固定合約制和報價方式，讓您的寶貴時間花在專案需求上，讓服務跟得上變化。 </p> <figure> <img src="/dataImgs/blog/37/02.png"> </figure> <h2> <b>服務流程</b> </h2> <ol> <li dir="ltr">需求會議 - 可以預約我們<a href="https://gingerdesign.com.tw/form/demand-form">免費顧問諮詢一小時</a>，說明您的需求，交流可能解決方案</li><li dir="ltr">野薑提供報價單 & 合約，會包含預估時數，建議完工日期範圍，檔期，及付款方式</li><li dir="ltr">在您完成匯款後，我們就會開始動工囉</li><li dir="ltr">每雙週我們會提供報表，讓您知道目前工時及進度</li> </ol> <figure> <img src="/dataImgs/blog/37/03.png"> </figure> <h2> <b>彈性時數與固定包案的差異</b> </h2> <figure> <img src="/dataImgs/blog/37/04.png"> </figure> <p> <br> </p> <div dir="ltr" align="left"> <table> <tbody> <tr> <td> <br> </td> <td> <b>彈性時數制</b><br> </td> <td> <b>固定包案制</b><br> </td> </tr> <tr> <td> 計費方式<br> </td> <td> 依據工時計費&nbsp; 2000/hr<br> </td> <td> 依據專案計費&nbsp;<br> </td> </tr> <tr> <td> 簽署合約<br> </td> <td> 節省行政成本<br> </td> <td> 需合約流程<br> </td> </tr> <tr> <td> 驗收方式<br> </td> <td> 雙週提供報表<br> </td> <td> 專案階段完成後提供服務結果<br> </td> </tr> <tr> <td> 適用工程<br> </td> <td> 10萬以內小工程支援<br> </td> <td> 10萬以上大工程規劃<br> </td> </tr> <tr> <td> 結帳週期<br> </td> <td> 以 1-2 次支付簡化支付<br> </td> <td> 以 3 - 5 次多次支付<br> </td> </tr> <tr> <td> 修改次數<br> </td> <td> 依據需求彈性調整<br> </td> <td> 內含預設修改次數<br> </td> </tr> </tbody> </table> </div> <p dir="ltr"> 時數制適合小工程，不用擔心小工程需求沒人可以做，或是市場很少見的需求。包案制適合雙方對功能想像明確，規格清楚的時刻。如果不確定您的網站屬於小工程或者大工程，請參見〈<a href="https://gingerdesign.com.tw/blog/%E6%96%B0%E6%89%8B%E7%AA%97%E5%8F%A304%EF%BD%9C%E5%93%AA%E4%BA%9B%E6%98%AF%E5%A4%A7%E5%B7%A5%E7%A8%8B%EF%BC%9F%E5%93%AA%E4%BA%9B%E6%98%AF%E5%B0%8F%E5%B7%A5%E7%A8%8B%EF%BC%9F%8F%A303%EF%BD%9C%E7%B6%B2%E7%AB%99%E5%8F%AF%E4%BB%A5%E5%81%9A%E4%BB%80%E9%BA%BC%EF%BC%9F%E9%83%BD%E6%9C%89%20FB%EF%BC%8FLINE@%EF%BC%8FIG%EF%BC%8FTwitter%EF%BC%8FYoutube%20%E9%82%84%E9%9C%80%E8%A6%81%E7%B6%B2%E7%AB%99%E5%97%8E%EF%BC%9F">哪些是大工程？哪些是小工程？</a>〉簡單說明判斷方法。 </p> <h2 dir="ltr"> <b>需要注意什麼事？</b> </h2> <ol> <li dir="ltr">想要先過目報價單 &amp; 合約範例，給主管、採購參考，請填寫您的 Email，我們會寄送給您。詳細請參考〈<a href="https://gingerdesign.com.tw/blog/%E5%A0%B1%E5%83%B9%E7%B0%BD%E7%B4%84%E5%B0%8F%E7%B4%B0%E7%AF%80">報價簽約小細節</a>〉以及〈<a href="https://gingerdesign.com.tw/blog/%E8%A8%AD%E8%A8%88%E9%96%8B%E7%99%BC%E5%A6%82%E4%BD%95%E6%BA%9D%E9%80%9A%EF%BC%9F">網站開發流程</a>〉。</li><li dir="ltr">時數制和包案制都需要排檔期喔，野薑專心能量有限，早點預約比較好～</li><li dir="ltr">時數制也會開發票喔</li> </ol> <p> <br> </p> <h2 dir="ltr"> <b>Q&amp;A</b> </h2> <p dir="ltr"> <b>Q / 和窗口對談算不算時數？</b> <br> A / 不算時數喔，請盡量的描述您的問題，將問題解決最重要。 </p> <p dir="ltr"> <b>Q / 有沒有需求與所需工時的對照表可以參考？</b> <br> A / 官網首頁含動畫範例 |&nbsp; 25 - 30 小時<br> &nbsp; &nbsp; &nbsp; 安裝 SSL | 4-5 小時<br> &nbsp; &nbsp; &nbsp; 最新消息範例 | 10 - 15 小時<br> 歡迎來信詢問～ </p> <p dir="ltr"> <b>Q / 時數制如何驗收工時？</b> <br> A / 我們會先提供您一個時數範圍，例如 15 - 20 小時，多退少補，用多少算多少唷！ </p> <p dir="ltr"> <b>Q / 我可以包套後，追加內容用時數制嗎？</b> <br> A / 可以，請參考維護約 - 保固方案，我們會建議您準備一筆預算，在完工後，依據時數請款。請參考<a href="https://gingerdesign.com.tw/blog/%E7%B6%AD%E9%81%8B%E7%B4%84%E3%80%81%E5%8D%87%E7%B4%9A%E7%B4%84%E6%9C%89%E4%BB%80%E9%BA%BC%E4%B8%8D%E5%90%8C%EF%BC%9F">維護約說明</a>，或是來信詢問。 </p> <p dir="ltr"> <b>Q / 時數制跟後續維護約有什麼不同？</b> <br> A / 時數制適用於雙方對專案想像明確的階段！維護約則依據需求階段，提供不同方案支援。請參考<a href="https://gingerdesign.com.tw/blog/%E7%B6%AD%E9%81%8B%E7%B4%84%E3%80%81%E5%8D%87%E7%B4%9A%E7%B4%84%E6%9C%89%E4%BB%80%E9%BA%BC%E4%B8%8D%E5%90%8C%EF%BC%9F">維護約說明</a>，或是來信詢問。 </p> <p dir="ltr"> <b>Q / 決定方案後，日後我可以轉換計費方案嗎？</b> <br> A / 途中不可轉換。但您可以提出需求，我們會與您討論，在那一開發階段完成後進行轉換會比較好。 </p> <p> <br> </p> <p dir="ltr"> 如果對於時數制有其他疑惑，是以上Q&amp;A沒能回答到的，都歡迎和我們提出討論唷：） </p> <p> <br class="Apple-interchange-newline"> </p>

有些小工想要完成，但簽合約費時費力？一開始規劃的需求，和之後有些差異，又要再開包案來處理，有點小題大作。市場好像有變化了，想做一些小測試試...

哪一個野薑服務最適合我？

<h3 dir="ltr"><b>網站開發完後，還有哪些事需要做？</b></h3><p dir="ltr">網站開發完後，還有哪需事需要做？可以放著不管嗎？讓網站繼續幫我收單賺錢嗎？</p><p dir="ltr">您的疑問，我們都懂！基本上，網站和店面很像，如果要賺錢，也是要持續維持，但和店面不同的是，租金相對低很多，程式碼也能幫助減輕人力，但仍是需要繼續努力「維持店面」！</p><p dir="ltr">延伸閱讀：各種類型網站 vs 建議經營人力</p><h3><b>後續經營的任務和人力</b></h3><p dir="ltr">所以，蓋完網站，真正旅程才開始，以下為大家介紹，做的事情，這裡分為網站內容團隊、工程團隊，兩邊都有要繼續努力的事：</p><p dir="ltr"><b>網站內容團隊</b>（最少 1 人 ，通常由貴司人員擔任，搭配外部專業寫文）</p><p dir="ltr">工作任務 / 需要增添商品、商品文章介紹、收集客戶回饋、整理需求和工程團隊溝通</p><p dir="ltr"><b>工程團隊</b></p><p dir="ltr">工作任務&nbsp; /&nbsp; 監控 Google 爬蟲、協助修 bug 、連結、 文字 、 顏色、小幅度功能修改</p><h2 dir="ltr"><b>維護約方案！</b></h2><p dir="ltr">驗收完的網站，很有可能還會有一段時間，需要來回修改。因為在使用過程，會發現這裡和當初預想不同，需要修改等等。可以參考我們維護約，獲得工程支援，讓網站調適更順手！</p><p><br></p><div dir="ltr" align="left"><table><tbody><tr><td><b>維護約</b><br></td><td><b>方案內容</b><br></td><td><b>建議購買月數</b><br></td><td><b>計費方式</b><br></td></tr><tr><td>加值方案<br></td><td>-功能修改&nbsp;<br>(基於已有資料小幅度修改)<br>- 網站經營基礎教學<br>- bug修復<br>- 文字/顏色/連結配合修改<br>- 重啟服務<br></td><td>網站上線後 3 個月，購買此約，可以因應多方要求修改<br></td><td>依據需求複雜度計費<br></td></tr><tr><td>安心方案<br></td><td>- bug修復<br>- 文字/顏色/連結配合修改<br> 重啟服務<br></td> <td>網站上線後 6 個月，購買此約，可配合客戶回饋修改<br></td><td>依據需求複雜度計費<br> </td></tr><tr><td>保固方案<br></td><td>- bug修復<br>- 重啟服務<br></td><td>網站上線後 6 個月，工程支援，確保持續收單不斷線<br> </td><td>固定月費<br></td></tr></tbody></table></div><figure><img src="/dataImgs/blog/22/cover.png" data-image="photo-5"></figure><h2 dir="ltr"><b>升級約是什麼？</b></h2><p dir="ltr">當網站度過 12 個月，滿一歲後，恭賀！想必您更理解如何經營數位世界的事業了！如同店面需要年度維修，車子年度檢修，網站也是一樣～</p><p dir="ltr">因為網路世界是動態的，各種事物也不斷升級中，網站放著不升級，可能 5~10 年後會需要面臨砍掉重蓋！升級的成本，有可能和蓋一個新網站相同，而且還要面臨流失客戶的風險，請務必做好升級規劃！</p><p><br></p><p dir="ltr">但如果您經營一年，發現這點子不起色，猶豫是否要投入資源升級，我們會建議，先不要升級，考慮我們的<b>需求研究 / 網路知識顧問服務</b>，幫忙診斷一下 : )&nbsp;</p><p dir="ltr">如果您的事業，已經穩定從數位世界獲得益處，或是您的服務，已被大量用戶認可。我們會非常建議您，每年定期升級，讓網站持續發揮效益！</p><p dir="ltr">我們知道事業展開很耗心力，只要是野薑的客戶，我們會定期診斷您的網站，讓您少煩一件事~</p><p><br class="Apple-interchange-newline"></p>

網站如同一家店面，年度維修也是必須的

維運約、升級約有什麼不同？

<h2><b>維護約方案！</b></h2><p dir="ltr">驗收完的網站，很有可能還會有一段時間，需要來回修改。因為在使用過程，會發現這裡和當初預想不同，需要修改等等。可以參考我們彈性時數方案，獲得工程支援，讓網站調適更順手！</p><p dir="ltr"><b>計費方式：</b></p><p dir="ltr">專業工程支援一小時 2000</p><p dir="ltr"><b>如何採用：</b></p><p dir="ltr">step1&nbsp; 野薑依據需求評估時數，並提供報價單</p><p dir="ltr"><span class="Apple-tab-span"> </span>ex: 某 A 需求，需要 3-4小時完成</p><p dir="ltr">step2&nbsp; 客戶同意時數</p><p dir="ltr">step3&nbsp; 預支時數 5 成，作為合約成立</p><p dir="ltr">step4&nbsp; 工程支援</p><p dir="ltr">step5&nbsp; 驗收，若需修改，則再計入時數</p><p dir="ltr">step6&nbsp; 支付剩餘時數</p>

不同團隊規模，讓驗收更有效益

選擇適合團隊的驗收方式

<h2><b>專案開發</b></h2><p>報價合約通過後～會進入彼此最開心的設計開發時期，也是合作的開始囉！我們會盡力協助您，將您的想法落實在網路上，但也需要您傳達團隊內的想法。</p><figure><img src="/dataImgs/blog/20/cover.png" data-image="35416bd78460f6f24ecd8b2be5c8d500"></figure><p dir="ltr">延伸閱讀：新手窗口該如何是好？<br class="Apple-interchange-newline"></p><h3 dir="ltr">以下列出客戶常見的問題，可以在需求階段，討論您想要的服務 -</h3><ul><li dir="ltr"><b>需求研究：</b>如果還不確定服務流程、自家客戶狀態，可以考慮從需求研究開始，讓企劃更踏實。</li><li dir="ltr"><b>設計提案：</b>我們會用簡報方式，與您討論風格、網站主要服務，通常會搭配內部簡報，與您一起向主管說明想法。</li><li dir="ltr"><b>設計執行：</b>此階段進入我們專業範圍，我們會考量技術穩定性、使用者經驗、客戶品牌、客戶。</li></ul><ul><li><b>設計驗收</b>：您可以依據團隊內狀況，選擇不同驗收方式，我們也會在需求階段，確認您期待的驗收方式，請參考下方「選擇適合團隊的驗收方式」。</li></ul><h2><b>設計階段的溝通﻿</b><br class="Apple-interchange-newline"></h2><p dir="ltr">請將網站想成網路店面，您會想要給客人什麼感覺呢？您可以透過<a href="https://www.pinterest.com/"> pinterest</a> 網站找到很多範例。或是 Google 看你同行的網站，記錄下來給人的感受，值得學習的點。找找喜歡家具品牌、裝潢風格，試著描述你覺得好的地方，想調整的地方，這類傳達都能有效幫助設計師理解喔！</p><p dir="ltr">因為設計階段是個發散收斂的雙菱形過程。您會隨著設計進程，有不少想法冒出來，這些都可以記下來。</p><figure><img src="/dataImgs/blog/20/02.png" data-image="0dd695e40afffb669db5f310baf308ab"></figure><p dir="ltr">網站逐漸成形讓人感到開心，但別忘了，最終要將訪客達成目的才行。我們建議每一頁，都要問這三個問題</p><ol class="arx-block-state" style="margin-left: 0px; padding-left: 20px;"><li dir="ltr">誰將造訪這個網頁？</li><li dir="ltr">你希望網頁造訪者做什麼？</li><li dir="ltr">你要如何讓他們做？</li></ol><p dir="ltr">我們也會依據您的需求清單，不斷和您核對，您的想法是否能解決問題？ 依據我們經驗，第一個想法通常太直覺，我們建議讓子彈飛一下，讓想法有生長空間。請記得愛上問題，解決方案有很多種喔！</p><p dir="ltr">看起來有難度？別擔心，這些都包在野薑設計服務範圍，我們會協助您一步步打造網站。<b></b></p><h3>測試階段的溝通</h3><p>在測試階段，我們會給您 Beta 網站版本，您可以參考下方驗收方式，選用最適合團隊的方式驗收</p><p><br class="Apple-interchange-newline"></p>

理解設計開發流程，讓腦袋idea發揮到對的地方，表達更到位

設計開發如何溝通？

<h2><b>如何估算專案費用？</b></h2><p>在瞭解需求後，我們會展開第一次估價，如果已經有價格帶是最棒的！我們可以在前一階段需求會議，依據價格帶，抓出最核心的需求。但如果拿捏不準價格帶，也沒問題！有兩種方式可以協助評估：</p><p><b>A.</b> <b>估算服務</b></p><p>可以從我們提供「<b>我想參考報價、時程</b>」服務！參考我們作品集，找一個最接近想像的專案，點選「<b>我想參考報價、時程</b>」，填上聯絡資訊，我們會寄過去報價和時程，給您參考！快速抓價格帶～</p><figure><img src="/dataImgs/blog/19/cover.png" data-image="2308360feec252ec477a9d86ab6fd8a7"></figure><div class="grid"></div><p><b>B. 使用免費顧問一小時﻿</b></p><div class="grid"></div><p dir="ltr">歡迎使用免費顧問諮詢一小時服務，在瞭解需求後，我們會寄送建議信給您。理解需求後再進行估價，會更精準喔。</p><p><a href="https://www.gingerdesign.com.tw/blog/%E7%B6%B2%E8%B7%AF%E7%9F%A5%E8%AD%98%E9%A1%A7%E5%95%8F%20-%20%E6%9C%8D%E5%8B%99%E4%BB%8B%E7%B4%B9">參考免費顧問一小時</a></p><h2><b>﻿估算下一步？</b><br class="Apple-interchange-newline"></h2><p class="arx-block-state">如果幸運的彼此有對到，我們可以更仔細的討論需求和報價。有時候，集中資源將核心需求做好，反而更快能達到目標！我們可以協助評估，哪些是核心需求，及後續維運成本，並找出預算內的技術，達到目標。</p><figure><img src="/dataImgs/blog/19/01.png" data-image="f5ca5446599a5aeb766b831d7fcf1495"></figure><p>這一階段，雙方將會花一定時間，來會討論報價和需求。</p><p>也為您介紹報價單結構，讓您更快掌握 : )</p><figure><img src="/dataImgs/blog/19/02.png" data-image="37292d2429d47be23e5dc6bb1075a115"></figure><p dir="ltr"><b>報價通過後，簽約保護彼此吧～</b></p><p dir="ltr">野薑的合約結構：</p><ol><li dir="ltr"><b>服務建議書、提案簡報</b>，會是簽約前，雙方同意的專案方向</li><li dir="ltr"><b>報價單說明費用，匯款方式</b></li></ol><p><b>工作會議決議辦理、Email、文字往來：</b>擔心專案細節寫不進合約？專案合作中，需求討論紀錄下來，也會作為合約內容之一</p><figure><img src="/dataImgs/blog/19/03.png" data-image="80c6dbfbdd2a479f2e44ce880ce42828"></figure><p>報價通過後，進入簽約流程，是保護彼此的好方法喔！野薑也會為您預約合約說明，您可以透過視訊、通話方式，讓我們為您做說明，節省您的心力！有任何想法，也能當下討論，讓合約更貼近彼此的狀況。</p><figure><img src="/dataImgs/blog/19/04.png" data-image="a8469a14c55cd8e9aaffe29386a47301"></figure><p dir="ltr">當上述流程都完成後，我們就算正式攜手合作，會與您一起完成專案 : )&nbsp;</p><p><br class="Apple-interchange-newline"></p>

網站設計報價擔心超出預算，野薑提供估算服務，快速故算報價範圍

報價簽約小細節

<h1><b>專業建議</b></h1><h3><b>網路知識顧問是什麼？</b></h3><p class="arx-block-state">網路知識如茫茫大海，能做的事情越來越多，在資訊爆炸時代，節省注意力更快找到前進方向。變化萬千的網路世界，資訊爆炸的時代，到底要從何開始？該如何選擇？新的知識領域，有入門可以學嗎？</p><h3><b>我能獲得什麼？</b></h3><p dir="ltr">✓ 第一次免費通話諮詢 ( 60min )</p><p dir="ltr">✓ 平易近人的解釋，讓您快速理解，基礎網路概念</p><p dir="ltr">✓ 新手入門的指引方向、關鍵字，讓您在茫茫知識大海中有方向</p><h3><b>如何開始？</b></h3><div class="grid"></div><p dir="ltr">1. 填寫「<a href="https://beta.gingerdesign.com.tw/form/demand-form">客戶需求表單</a>」</p><p dir="ltr">2. 在<b>我需要的協助</b>，勾選「✓網路知識顧問」</p><p dir="ltr">3. 請盡量將表單填寫完整，讓我們更加理解您！顧問很快會和您聯繫～</p><p dir="ltr">備註：因為網路知識如茫茫大海，我們會在守備範圍內，為您提供最高品質的回答。若您的問題，需要特殊顧問，我們在徵求您的同意後，會為您協尋轉介適合的顧問。</p><h3 dir="ltr"><b>顧問結束後，如何進行下一步？</b></h3><p>顧問服務結束後，我們會為您整理需求信給您，並邀請您給我們評分回饋。</p><p>過往作為窗口，常常東問一家，西問一家，慢慢拼湊專案的知識。不過隔行如隔山，這一路拼湊下來，也是耗費不少心力，有些知識在 Google上找到也無法理解。</p><p>我們感受到尋找合作對象的困難，除了推出免費網路知識顧問，您也可以訂購「<b>需求專業建議」</b>付費服務，能協助您將最核心需求切出來，並提供施作建議簡報給您。</p><pclass="arx-block-state">這份文件可以讓您帶入團隊討論，與主管確認意向，能有效的節省來回溝通時間和心力。因為是專業製作，未來即使在報價階段無法和野薑合作，您也可以持有這份文件，與其他工作室討論。是有效節省您的心力的好方法。</p>

注意力珍貴年代，釐清需求再出手

Blog 文章

文章分類

以下是【野薑服務】有關的文章

哪一個野薑服務最適合我？

維運約、升級約有什麼不同？

選擇適合團隊的驗收方式

設計開發如何溝通？

報價簽約小細節

看我們如何協助釐清

Tofutype 豆腐字販賣所

梓書房-官方網站設計建置

國家人權委員會網站-視覺設計與插圖

Blog 文章

文章分類

以下是 【 野薑服務 】有關的文章

哪一個野薑服務最適合我？

維運約、升級約有什麼不同？

選擇適合團隊的驗收方式

設計開發如何溝通？

報價簽約小細節

看我們如何協助釐清

Tofutype 豆腐字販賣所

梓書房-官方網站設計建置

國家人權委員會網站-視覺設計與插圖

以下是【野薑服務】有關的文章