技術 [Day27-開發後期] 工程師可以如何使用 Figma？前端交付前的最後檢查

前端交付前的最後檢查 前面的篇幅大多在講工程師如何與設計師透過 Figma 合作，請設計師們配合產出文件，那 Figma 於工程師們可以有什麼價值呢？ 雖然進入...

技術 [Day21-開發中期] 欄位邏輯 Flow 🎢  藉由 Figma 模擬程式模組積木，定義功能互動及開發！（下）

積木化的流程圖 承上篇的結論，我們覺得既然要提供前端們開發功能的指引，透過這樣 「視覺化」 的方式，能夠很好的模擬程式模組的架構！ 以下是我們最後的流程圖：（因...

技術 [Day20-開發中期] 欄位邏輯 Flow 🎢  藉由 Figma 模擬程式模組積木，定義功能互動及開發！（中）

藉由 Figma 模擬程式模組 前面有提到，我們專案中的欄位間存在許多變化性的互動，和尤其是 「依賴關係」，因應不同時機欄位也可能有 enable &...

技術 [Day19-開發前期] 欄位邏輯 Flow 🎢  藉由 Figma 模擬程式模組積木，定義功能互動及開發！（上）

當一般流程圖的畫法不適用 前面幾篇提到，Logic Flow 有一些限制，像是無法面對複雜的程式邏輯，不具影響順序因素，所以比較適合線性、重複步驟，或是逐步進行...

技術 [Day18-開發中期] UI Flow 指引我回家 🌊  設計師的導航工具，工程師的明燈！（下）

我們是這樣藉由 UI Flow 溝通設計 昨天提到將 UI Flow 的作法用於描述局部功能的變化性，今天我們繼續來分享 方法二：專注情境，集中於 UI 的變化...

技術 [Day16-開發中期] UI Flow 指引我回家 🌊  設計師的導航工具，工程師的明燈！（上）

在流程圖中迷路 在前面兩篇提到，「透過 User flow 也可以再幫助我們釐清有哪些關鍵 UI 畫面需要產出」，「透過 Logic flow 可以清晰表現前端...

技術 [Day17-開發中期] UI Flow 指引我回家 🌊  設計師的導航工具，工程師的明燈！（中）

UI Flow 的限制 不過可以注意到，App 產品因為尺寸，也因為有較多頁面、功能切換的效果，很建議用 UI Flow 的方式交付設計。 但 Web 設計因為...

技術 [Day14-開發前期] User Flow、User Journey，還是 Logic Flow 🤔？流程圖百百種，哪種才適合？

根據專案目標選擇流程圖 在專案開發的前期階段，流程圖（flowchart）扮演著不可或缺的角色，可以幫助團隊更有效地溝通和協作，確保開發過程的順暢。 不過，不是...

技術 6. 吃吃記帳 - 流程圖 (Flow Chart)

為什麼需要流程圖？ 我前面介紹了吃吃記帳的產品發想、人物誌 Persona、使用者故事 User Story，和顧客旅程地圖 Customer Journey...

技術 [Day17]不可不知的小工具-如何畫好流程圖-2

前言 昨天有提到畫流程圖的一些小工具，今天就來說明畫流程圖的一些要點吧！下面的範例會用miro操作 流程圖的重要性 不同角色在互相溝通的時候，有時候單靠文字很容...

技術 [從0到1] C#小乳牛 練成基礎程式邏輯 Day 12 - 四大套路 讀懂程式碼 Sequence

套路程式碼的4種方法 | 一步一步來 | DEMO 🐄點此填寫今日份隨堂測驗

技術 [筆記本: Draw.io] 跨平台線上製作圖表工具

Draw.io Draw.io是個跨平台的網頁圖表工具支援Chrome、IE、Safari及FireFox等等瀏覽器，也可以設定將檔案儲存至硬碟、Google...

技術 流程圖示例學習 / Learning Flowchart by Example - 製作烤麵包過程

什麼是流程圖？ 流程圖可視化地表示和組織用於編寫或解釋問題解決方案的步驟。這是該流程的“流程”圖。流程圖是一種工具，可讓您將任何進程分解為單個事件或活動，並顯示...

技術 鏈接流程圖 - Linking Flowcharts

流程图可视化地表示和组织用于编写或解释问题解决方案的步骤。这是该流程的“流程”图。流程图是一种工具，可让您将任何进程分解为单个事件或活动，并显示它们之间的逻辑关...