iT 邦幫忙::一起幫忙解決難題，拯救 IT 人的一天

0 Like 0 留言 313 瀏覽

鐵人賽自我挑戰組 DAY 27

UI/UX設計的初心者冒險之旅系列第 27 篇

技術 DAY27＃實作練習-6_購物網站Prototype

根據那個階層圖表示，網頁視覺設計的Mockup完成之後，就是製作prototype的開始，也許會有沒想到的部分，但還是先嘗試看看吧！那就，頁面分述首頁...

Chloe ‧ 2024-09-07 ‧團隊iT 貓貓教

0 Like 0 留言 319 瀏覽

鐵人賽自我挑戰組 DAY 26

UI/UX設計的初心者冒險之旅系列第 26 篇

技術 DAY26＃實作練習-5_購物網站Mockup

在設計UI元件的時候，就已經開始思考網站雛型可能會長怎樣，不過我不是學設計的，要有很美觀的畫面會有點困難。但還是，嘿嘿， Mockup 　　依據那時候設計元...

Chloe ‧ 2024-09-06 ‧團隊iT 貓貓教

0 Like 0 留言 345 瀏覽

鐵人賽自我挑戰組 DAY 25

UI/UX設計的初心者冒險之旅系列第 25 篇

技術 DAY25＃實作練習-4_網站UI元件設計

原本今天的預期規劃是要完成Mockup，但對目前的我來說有點太吃力了，所以就著重在設計網站元件吧！那麼， UI元件設計　　從DAY24製作的小農網站wir...

Chloe ‧ 2024-09-05 ‧團隊iT 貓貓教

0 Like 0 留言 324 瀏覽

鐵人賽自我挑戰組 DAY 24

UI/UX設計的初心者冒險之旅系列第 24 篇

技術 DAY24＃實作練習-3_繪製網站Wireframe

目前小農購物網站的進度，已經從user story進展到UI flow，那接下來，就開始依據前一天繪製的內容，來製作每個介面的wireframe吧！那麼，...

Chloe ‧ 2024-09-04 ‧團隊iT 貓貓教

0 Like 0 留言 453 瀏覽

鐵人賽自我挑戰組 DAY 23

UI/UX設計的初心者冒險之旅系列第 23 篇

技術 DAY23＃實作練習-2_操作邏輯流程（Logic Flow）

在決定要製作一個簡易的小農購物網站後，回頭找了之前寫過的筆記，在DAY6那天，有截圖一個UI設計流程的階層圖，昨天已經完成有關User story的部分。那就...

Chloe ‧ 2024-09-03 ‧團隊iT 貓貓教

0 Like 0 留言 411 瀏覽

鐵人賽自我挑戰組 DAY 22

UI/UX設計的初心者冒險之旅系列第 22 篇

技術 DAY22＃實作練習-1_創建使用者故事/旅程

在歷經前面20天左右的UI/UX學習之後，接下來要準備嘗試實作練習，作為學習計畫的收尾。那麼，創建使用者故事　　假設有一位臺灣在地的A小農，他希望透過網...

Chloe ‧ 2024-09-02 ‧團隊iT 貓貓教

0 Like 0 留言 357 瀏覽

鐵人賽自我挑戰組 DAY 21

UI/UX設計的初心者冒險之旅系列第 21 篇

技術 DAY21＃使用者體驗要素（Elements of UX）

這陣子為了熟悉Figma的操作，在UI設計方面著墨許多，今天就來針對UX的相關知識來學習。那麼，使用者體驗要素　　相信在學習UI/UX設計的過程，一定會...

Chloe ‧ 2024-09-01 ‧團隊iT 貓貓教

0 Like 0 留言 498 瀏覽

鐵人賽自我挑戰組 DAY 20

UI/UX設計的初心者冒險之旅系列第 20 篇

技術 DAY20＃網頁基本結構與行動裝置設計準則

一個舒適的網頁可以讓使用者盡情瀏覽資料，所以學習一個網頁的基本結構是很重要的，而UX設計能進一步優化使用者的體驗感受。那就，網頁基本結構　　一個網頁結構...

Chloe ‧ 2024-08-31 ‧團隊iT 貓貓教

0 Like 0 留言 843 瀏覽

鐵人賽自我挑戰組 DAY 19

UI/UX設計的初心者冒險之旅系列第 19 篇

技術 DAY19＃Figma的網格系統 (Grid System)

好幾天之前在鐵人賽開始的DAY2，與排版相關的文章裡有提到網格系統（grid system）的概念，那今天就針對它學習吧。來吧！網格系統 (Grid Sy...

Chloe ‧ 2024-08-30 ‧團隊iT 貓貓教

1 Like 0 留言 366 瀏覽

鐵人賽自我挑戰組 DAY 18

UI/UX設計的初心者冒險之旅系列第 18 篇

技術 DAY18＃響應式網頁設計與行動優先設計

UI設計的部分學習了好幾天，也大改特改過ChatGPT的規劃。那今天呢，就來學習在規劃網站的時候應該要有的幾個概念。那麼，響應式網頁設計（Responsi...

Chloe ‧ 2024-08-29 ‧團隊iT 貓貓教

0 Like 0 留言 3166 瀏覽

鐵人賽自我挑戰組 DAY 17

UI/UX設計的初心者冒險之旅系列第 17 篇

技術 DAY17＃Prototype常見互動製作

透過Prototype的呈現可以讓團隊清楚了解版面設計與呈現方式，但要怎麼讓效果照預期的呈現，就需要應用學過的各種功能了，所以今天就來紀錄幾個常見的互動方式。...

Chloe ‧ 2024-08-28 ‧團隊iT 貓貓教

0 Like 0 留言 439 瀏覽

鐵人賽自我挑戰組 DAY 16

UI/UX設計的初心者冒險之旅系列第 16 篇

技術 DAY16＃將表單成果製作成Portotype

還記得我在DAY14那天用Figma設計了UI元件與表單，既然都有一個比較完整的設計稿了，不如直接拿它練習製作成Portotype吧！開練開練， Proto...

Chloe ‧ 2024-08-27 ‧團隊iT 貓貓教

0 Like 0 留言 664 瀏覽

鐵人賽自我挑戰組 DAY 15

UI/UX設計的初心者冒險之旅系列第 15 篇

技術 DAY15＃Figma的Portotype介紹

一般設計出來的線框稿或平面稿是不能互動的，這時候就需要製作可以模擬操作的Prototype（原型），來確認按鈕連結與預期效果。那就，操作總覽　　切換到P...

Chloe ‧ 2024-08-26 ‧團隊iT 貓貓教

0 Like 0 留言 427 瀏覽

鐵人賽自我挑戰組 DAY 14

UI/UX設計的初心者冒險之旅系列第 14 篇

技術 DAY14＃設計UI元件與製作表單

前面幾天學了很多有關於Figma的功能，今天就來嘗試看看設計UI元件，然後再製作表單試試看吧！那就，設計UI元件　　為了練習我這邊先設計可能會用到的元件...

Chloe ‧ 2024-08-25 ‧團隊iT 貓貓教

0 Like 0 留言 371 瀏覽

鐵人賽自我挑戰組 DAY 13

UI/UX設計的初心者冒險之旅系列第 13 篇

技術 DAY13＃Component的其他屬性介紹

Component的property（屬性）除了Variant，還有其他三種，分別是Boolean、Instance swap和Text，將這些功能統一彙整在這...

Chloe ‧ 2024-08-24 ‧團隊iT 貓貓教

0 Like 0 留言 394 瀏覽

鐵人賽自我挑戰組 DAY 12

UI/UX設計的初心者冒險之旅系列第 12 篇

技術 DAY12＃Component + Variant 操作 - Input

原以為需要再找資料來學習input的variant，沒想到直接打開Figma重新做一遍，欸？可以了耶？完全不知道昨天怎麼了。但還是紀錄一下吧， Compon...

Chloe ‧ 2024-08-23 ‧團隊iT 貓貓教

0 Like 0 留言 851 瀏覽

鐵人賽自我挑戰組 DAY 11

UI/UX設計的初心者冒險之旅系列第 11 篇

技術 DAY11＃Component + Variant 操作 - Button

前一天關於Component的功能認識中有提到，透過「/」命名方式能將物件分類，並快速置換Instance的組成。後來，在2020年底，Figma推出一個新功能...

Chloe ‧ 2024-08-22 ‧團隊iT 貓貓教

0 Like 0 留言 3249 瀏覽

鐵人賽自我挑戰組 DAY 10

UI/UX設計的初心者冒險之旅系列第 10 篇

技術 DAY10＃Figma的Component功能認識

講完了Auto layout能做到的幾個功能，接下來換針對Figma的Component來學習，希望之後要實作的話，回來都能看得懂 :D 那就， Compon...

Chloe ‧ 2024-08-21 ‧團隊iT 貓貓教

0 Like 0 留言 747 瀏覽

鐵人賽自我挑戰組 DAY 9

UI/UX設計的初心者冒險之旅系列第 9 篇

技術 DAY9＃Figma的Auto layout功能認識

在之前第一次製作wireframe的時候有說到一個功能，叫做Auto layout，非常非常容易在使用Figma的過程會使用到。那就， Auto layou...

Chloe ‧ 2024-08-20 ‧團隊iT 貓貓教

0 Like 0 留言 600 瀏覽

鐵人賽自我挑戰組 DAY 8

UI/UX設計的初心者冒險之旅系列第 8 篇

技術 DAY8＃Figma的基礎工具操作

ChatGPT的安排是，實際去製作一個簡單的wireframe之後，接著才是學習一些Figma的常用工具，有點像是體驗完後有個初步印象，再深入學習的感覺。那就...

Chloe ‧ 2024-08-19 ‧團隊iT 貓貓教

1 Like 0 留言 412 瀏覽

鐵人賽自我挑戰組 DAY 7

UI/UX設計的初心者冒險之旅系列第 7 篇

技術 DAY7＃使用Figma製作wireframe

上一篇講述有關UI設計流程與wireframe的概念，接下來可以開始學習接觸相關UI設計軟體，目前主流軟體有：Sketch、Adobe XD、Figma，關於這...

Chloe ‧ 2024-08-18 ‧團隊iT 貓貓教

0 Like 0 留言 428 瀏覽

鐵人賽自我挑戰組 DAY 6

UI/UX設計的初心者冒險之旅系列第 6 篇

技術 DAY6＃Wireframe的學習

前幾天，ChatGPT主要安排了與設計基礎和使用者相關的學習內容。接下來，我將展開與wireframe相關的學習，相信搜尋過UI/UX設計的人一定會接觸到這部分...

Chloe ‧ 2024-08-17 ‧團隊iT 貓貓教

0 Like 0 留言 408 瀏覽

鐵人賽自我挑戰組 DAY 5

UI/UX設計的初心者冒險之旅系列第 5 篇

技術 DAY5＃How to 設計？

上一篇針對使用者的部分，分享了如何研究他們的方法，接下來回到UI和UX設計本身，身為一個什麼都不懂的人，又要從哪裡開始構思設計呢？那就，設計思考　　在搜...

Chloe ‧ 2024-08-16 ‧團隊iT 貓貓教

1 Like 0 留言 462 瀏覽

鐵人賽自我挑戰組 DAY 4

UI/UX設計的初心者冒險之旅系列第 4 篇

技術 DAY4＃使用者研究與使用者旅程

我們在上一篇記錄了有關於UI和UX的分別，今天筆記的著重點會比較偏向UX的部分，也就是學習有關如何研究我們的「使用者」。老樣子，使用者研究　　產品最終的...

Chloe ‧ 2024-08-15 ‧團隊iT 貓貓教

1 Like 0 留言 621 瀏覽

鐵人賽自我挑戰組 DAY 3

UI/UX設計的初心者冒險之旅系列第 3 篇

技術 DAY3＃UI/UX基礎概念

在了解完設計基本知識之後，是時候開始接觸UI/UX設計的基本概念了，所以，今天就會針對這部分來做些筆記。那就， UI vs UX 　　在架設網站或設計遊戲的...

Chloe ‧ 2024-08-14 ‧團隊iT 貓貓教

1 Like 0 留言 501 瀏覽

鐵人賽自我挑戰組 DAY 2

UI/UX設計的初心者冒險之旅系列第 2 篇

技術 DAY2＃設計基本原則-排版與視覺層級

話說，咱們ChatGPT第一天的規劃，就要認識色彩理論、文字排版、視覺層級這些設計基本原則，就搜尋網路資料而言，其實時間上是可以的，不過要做成筆記又是另外一回事...

Chloe ‧ 2024-08-13 ‧團隊iT 貓貓教

2 Like 0 留言 499 瀏覽

鐵人賽自我挑戰組 DAY 1

UI/UX設計的初心者冒險之旅系列第 1 篇

技術 DAY1＃設計基本原則-色彩理論與配色

嘿，在開賽前兩天只是和朋友聊一聊，就被推坑來督促自己學習新東西。說實在的，我並沒有實際接觸過任何有關程式、設計或UI/UX的知識，嗯，如果資訊課跟統計分析學不算...

Chloe ‧ 2024-08-12 ‧團隊iT 貓貓教

0 Like 0 留言 489 瀏覽

鐵人賽 IT 管理 DAY 1

【前端工程師＆UI 的 30 天約會】戰勝猴子！：Figma 交付實戰篇系列第 1 篇

技術 [Day1-介紹] 猴子是誰？！前端工程師與 UI 設計師如何透過 Figma 協作！

本系列介紹單純討論設計流程、開發流程的文章很多，但團隊組成和會遇到的問題百百種！本系列將搭配專案，分享實際狀況中遇到的問題和應對做法。藉由「使用者導向」的概...

TC ‧ 2024-09-13 ‧團隊擁有夢想的鐵人猴子隊

1 Like 0 留言 4079 瀏覽

技術新手指南：快速掌握UI/UX設計及實用工具推薦

在當今這個數位化的時代，UI/UX設計的重要性日益凸顯，它不僅關乎產品的視覺呈現，更影響著用戶體驗的質量。因此，許多設計新手都積極尋找能快速上手並提升設計效率的...

jasminecheng ‧ 2024-01-30

1 Like 0 留言 1037 瀏覽

鐵人賽 SideProject30 DAY 19

營養師不開菜單要用 Next.js 13 寫全端系列第 19 篇

技術營養師不開菜單的第十九天 - Next.js 實作 - Link In Bio Tool 畫面設計與整體規劃

前言在前15篇章節中，已經詳細介紹了專案中使用的套件及在專案中的具體實作方式。接下來的文章將深入探討專案的細節和商業邏輯。考慮到這是一個從零開始建立的產品，我...

ysl0628 ‧ 2023-10-04 ‧團隊所以隊名要叫什麼