104學習

104人力銀行 / 羅技電子股份有限公司 / Software Lead UX Designer / 符合度分析
Software Lead UX Designer 羅技電子股份有限公司
我要應徵
符合度
?
履歷符合度： 履歷：
登入計算
適合度
?
性格適合度： 性格：
登入計算

學歷

未具備

大學

經歷

不拘
希望您擁有
產品行銷企劃
有已符合的經歷忘了填寫嗎？記得定期 更新履歷 喔

學習推薦

不知如何開始學習嗎？ 先進行技能挑戰吧～
我要挑戰
UI 設計新手村：Figma學習之旅🪐
關注
104學習

產品

2024/10/28

如何在Figma中，一次將文字轉為大寫或小寫？懶人福音一鍵搞定超簡單
在設計中，文字格式的統一性非常重要。Figma作為設計師常用的設計工具之一，提供了方便的「文字轉換」功能（Text Transform），可讓用戶輕鬆將文字一次性轉為大寫、全小寫或標題大小寫。本篇文章將深入介紹如何在Figma中進行文字大小寫的快速轉換，幫助你提升設計效率。
▮為什麼需要使用文字大小寫轉換？
1. 提升設計一致性：當需要統一標題或段落的大小寫格式時，使用Figma的文字轉換功能可以確保整體設計風格一致。
2. 節省時間：避免手動逐字調整大小寫，提升設計流程的效率。
3. 更好地適應設計變更：在進行UI/UX設計迭代時，能夠靈活應對文字樣式的變更需求。
▮如何在Figma中一次性將文字轉為大寫或小寫？
以下是具體操作步驟：
1. 選中要轉換的文字層（Text Layer）
首先，在畫布（Canvas）上選中你想要改變大小寫的文字層。可以是標題、段落或其他文字元素。
2. 打開右側的屬性面板（Properties Panel）
當選中文字層後，Figma介面的右側會顯示屬性面板，這裡包含該文字層的所有設置選項，如字體、字重、字體大小、顏色等。
3. 找到「Text」部分
在屬性面板的「Text」部分，可以看到文字相關的設定，這是調整文字大小寫的起點。
4. 展開「Text Transform」選項
在「Text」屬性部分的下方，可以找到「Text Transform」選項。點擊展開後，你會看到以下選項：
- Uppercase（全大寫）：將選中的文字轉為全大寫格式。
- Lowercase（全小寫）：將選中的文字轉為全小寫格式。
- Title Case（標題大小寫）：將文字轉為標題樣式，每個單詞的首字母大寫。
- Original Case（原始大小寫）：將文字恢復為原始的大小寫狀態。
5. 選擇需要的文字轉換方式
選擇合適的大小寫轉換選項，文字層會立即顯示出相應的效果，無需手動調整。
▮文字轉換的最佳實踐
1. 統一標題格式：當你在設計標題或重要文字時，可以使用Uppercase選項，讓標題顯得更加醒目和專業。
2. 適用於批量轉換：可以一次選中多個文字層，然後應用相同的文字轉換選項，以實現快速統一。
3. 靈活應對設計需求變更：在設計過程中，當需要變更文字格式時，只需通過「Text Transform」即可快速完成修改，無需手動調整。
▮結論
在Figma中，一次性將文字轉為大寫或小寫是提升設計效率和保持格式一致性的關鍵功能。無論是用於標題設計還是段落格式調整，文字轉換（Text Transform）功能都能讓你更輕鬆地應對不同的設計需求。如果想要在設計過程中節省時間並提高整體設計效果，不妨試試這個方便的功能。
看更多
如何在Figma中，一次將文字轉為大寫或小寫？懶人福音一鍵搞定超簡單
2 0 4432 1
UI 設計新手村：Figma學習之旅🪐
關注
104學習

產品

2024/10/28

Figma 統一文字樣式方法：教你建立自己的文字範本，保存文字樣式，下次直接叫出使用
在設計專案中，保持文字格式的一致性是非常重要的。Figma中提供了一個功能，讓你可以輕鬆將常用的文字格式保存為「文字樣式」（Text Styles），以便在專案中反覆使用。本文將為你介紹如何在Figma中創建和應用文字樣式，從而提高設計的效率和一致性。
▮什麼是文字樣式？
文字樣式是Figma中用來儲存和重用文字格式的功能，包含字體、字重、字體大小、顏色、行高、字距等設定。透過將文字樣式保存，你可以在整個專案中快速應用統一的文字格式，而不需要手動一一調整。
▮如何在Figma中將文字保存為文字樣式？
以下是創建文字樣式的詳細步驟：
1. 選中設計好的文字
在畫布（Canvas）上，選擇你想要保存的文字層（Text Layer）。確保已設置好所有的文字屬性，例如字體、字重、字體大小、顏色、行高、字距等。
2. 打開右側屬性面板（Properties Panel）
選中文字層後，Figma介面的右側會顯示屬性面板。在面板中，你可以看到所有與文字相關的屬性設定。
3. 找到「文字樣式」區域（Text Style Section）
在屬性面板中的「Text」部分下方，你會看到一個標籤為「Text Style」的區域。這個區域用來管理文字樣式。
4. 點擊「+」按鈕（Create Style）
在「Text Style」區域右側有一個「+」按鈕（即「Create Style」）。點擊此按鈕會彈出一個對話框，讓你可以為新的文字樣式命名。
5. 命名樣式（Name the Style）
在彈出的對話框中，輸入一個清晰的名稱來命名這個文字樣式。例如「標題-加粗-24pt」或「正文-常規-16pt」，以便你和團隊成員在後續應用時能快速識別樣式。完成命名後，點擊「Create Style」按鈕保存。
▮如何在其他文字層上應用文字樣式？
一旦保存了文字樣式，你可以在設計過程中輕鬆地應用它：
1. 選中需要應用樣式的文字層。
2. 在右側屬性面板的「Text Style」區域中，點擊下拉選單。
3. 從選單中選擇所需的文字樣式。
文字層會立即應用選定的文字樣式，無需手動調整格式。
▮文字樣式的好處
1. 提高設計一致性：文字樣式確保整個專案中使用相同的文字格式，避免不同頁面間的格式不一致。
2. 加速設計流程：保存和重用文字樣式可減少手動調整的時間，提升設計效率。
3. 便於更新：如果需要修改樣式，只需在文字樣式中進行一次更改，所有應用了該樣式的文字層都會同步更新。
▮最佳實踐：文字樣式的應用
1. 分類管理：在創建文字樣式時，按照功能分類，如「標題」、「副標題」、「正文」、「註釋」等，方便快速查找和應用。
2. 使用設計系統：如果你有一個完整的設計系統，請將文字樣式納入其中，以便在不同專案中重用。
3. 命名規則清晰：採用一致的命名規則來命名文字樣式，讓樣式一目了然，提高團隊協作效率。
▮結論
在Figma中創建和應用文字樣式是設計中保持一致性和提升效率的關鍵。無論是大型專案還是日常設計工作，文字樣式的合理運用都能讓你的設計流程更加順暢。透過本篇指南，相信你已掌握如何在Figma中將文字保存為文字樣式，並有效地應用於設計中。
看更多
Figma 統一文字樣式方法：教你建立自己的文字範本，保存文字樣式，下次直接叫出使用
0 0 3571 2
UI 設計新手村：Figma學習之旅🪐
關注
104學習

產品

2024/10/28

Figma Asset 是什麼？用來管理Components超方便，不要再傻傻複製貼上了
在Figma中，Asset（資產）是設計師用來管理和重用設計元素的強大工具。它可存放常用的樣式（Styles）、組件（Components）、變量（Variables）等，讓設計師能在不同頁面或專案中快速調用已設計好的資源。以下將詳細介紹Figma中Asset的功能。
▮Figma中的Asset概念
Asset主要包含以下幾個部分：
1. 組件（Components）
是Figma中可重用的設計元素，類似於設計模組或模板。例如，按鈕（Button）、導航欄（Navigation Bar）、圖示（Icon）等都可以作為組件被添加到Asset中。
2. 樣式（Styles）
包括顏色樣式（Color Styles）、文字樣式（Text Styles）、效果樣式（Effect Styles，如陰影、模糊等）。透過這些樣式，可以在設計中保持一致性，並快速套用或更新設計。
3. 變量（Variables）
是用來儲存和管理不同屬性值的工具，如顏色模式（Color Mode）、字體尺寸（Font Size）、間距（Spacing）等。變量可在不同情境下應用，讓設計更靈活。
▮如何使用Asset面板
Asset面板通常位於Figma左側邊欄內，並包含以下功能：
1. 創建和管理組件（Components）
- 建立組件（Create Component）：選中要設為組件的元素，右鍵選擇「Create Component」，或使用快捷鍵 Cmd/Ctrl + Alt + K。
- 組件的使用：在Asset面板中，可以拖曳組件到畫布（Canvas）上，重用已設計的元素。
2. 保存樣式（Styles）
- 文字樣式（Text Styles）：選中設計好的文字，點擊右側樣式面板的「+」按鈕，將其保存為文字樣式，方便後續使用。
- 顏色樣式（Color Styles）：設置顏色後，也可以將其存為顏色樣式，快速應用在不同元素上。
- 效果樣式（Effect Styles）：如陰影（Shadow）或模糊（Blur）等效果，也能被儲存並重用。
3. 變量的應用（Variables）
- 在資產面板中，設計師可以定義不同的變量組（Variable Sets），如亮色模式（Light Mode）和暗色模式（Dark Mode），並在不同情境下快速切換。
- 當需要修改整個專案的屬性（如顏色或間距）時，只需修改變量的值，其他引用了這些變量的元素都會同步更新。
▮Asset的優勢
1. 提高一致性（Consistency）
透過Asset中的樣式和組件，可以在整個專案中保持一致的設計風格，避免不同頁面間的風格不協調。
2. 加速設計流程（Design Process Acceleration）
重用已存的資產可以減少重複勞動，縮短設計時間。
3. 便於團隊協作（Team Collaboration）
Figma中的Asset是多人協作的重要工具，所有人都可以從Asset面板中調用相同的設計資源，保持專案風格的統一。
▮如何最佳化使用Asset
1. 分類管理（Categorized Management）
將組件和樣式進行分類（如按功能、頁面、元件類型等），方便快速查找和應用。
2. 定期更新（Regular Update）
確保組件、樣式和變量的資源是最新的，以免在不同版本間出現不一致的情況。
3. 使用設計系統（Design System）
建立完整的設計系統（Design System），將所有設計規範、元件和樣式都納入Asset中，便於長期的專案維護和拓展。
透過對Figma中Asset的靈活運用，設計師可以提升設計效率和品質。Asset不僅是個人設計的好幫手，也是團隊協作中不可或缺的工具。
看更多
0 0 2284 1
UI 設計新手村：Figma學習之旅🪐
關注
104學習

產品

2024/10/28

如何在Figma中快速複製格式？這個功能鍵超強大，減少手動調整格式的繁瑣步驟
在Figma的設計過程中，保持一致的樣式和格式是一個重要的事情。Figma提供了一個強大的功能，可以幫助設計師快速複製格式，提升工作效率，讓設計更加流暢。而透過使用複製格式的快捷鍵，更可以進一步加快操作速度。本篇文章將深入介紹如何在Figma中使用格式複製功能，並包含所有必要的快捷鍵。
▮什麼是Figma的格式複製？
格式複製是一個可以快速將一個元素的屬性（如字體、顏色、描邊、陰影等）應用到另一個元素的功能。這個功能特別適合用於大型專案中，當設計師需要維持整個專案的樣式一致時，它可以幫助減少手動操作。
▮為什麼格式複製很重要？
1. 節省時間：不需要逐一手動調整每個元素的格式。
2. 保持一致性：確保設計的風格、色彩和排版一致。
3. 提升效率：加快設計迭代和修改速度，尤其在團隊協作中。
▮如何在Figma中複製格式？
1. 使用快捷鍵複製格式
- 複製格式的快捷鍵：選中需要複製格式的元素，按 Cmd + Alt + C (Mac) 或 Ctrl + Alt + C (Windows) 來複製格式屬性。
- 貼上格式的快捷鍵：選擇要應用格式的元素，按 Cmd + Alt + V (Mac) 或 Ctrl + Alt + V (Windows) 來貼上複製的格式。
2. 複製特定屬性
- 如果只想複製某些特定屬性，如字體或顏色，可以先在右側的屬性面板中取消勾選不需要的屬性，再使用快捷鍵進行複製。
- 範例：如果只想複製填充顏色，選中填充後，按 Cmd/Ctrl + Alt + C，然後選擇另一個元素並按 Cmd/Ctrl + Alt + V。
3. 多個元素間的格式複製
- 選擇多個元素來一次性將相同的格式應用到不同的元素上。這在需要快速將相同格式應用到多個地方時非常有用。
4. 使用樣式來保持一致性
- 除了手動複製格式外，你還可以將常用的格式存儲為樣式（如文字樣式、顏色樣式等），方便在整個專案中應用。
- 建立樣式的步驟：
1. 選擇一個元素，設置其格式。
2. 在右側面板中，點擊+按鈕，將其保存為一個新樣式。
3. 以後要應用此樣式時，只需在樣式面板中選擇即可。
▮小技巧：格式複製的進階應用
1. 快速更新設計樣式：當需要對整個專案的某個樣式進行調整時，可以先在一個元素上修改格式，然後快速將這個更新的格式複製到其他元素上。
2. 應用在不同頁面間：即使在不同的頁面之間，格式複製功能依然有效。只需切換到目標頁面並選擇元素貼上格式即可。
3. 支援群組與框架：格式複製不僅適用於單個元素，也適用於群組和框架。只需選中群組或框架並使用相同的快捷鍵操作，即可快速複製其格式。
▮常見的錯誤及如何避免
1. 未選中目標元素：在貼上格式時，需確保已正確選中目標元素，否則格式無法成功應用。
2. 誤複製過多屬性：在複製之前，請先確認所需的屬性是否正確，以避免多餘的格式覆蓋。
▮結論
Figma的格式複製功能是一個提升設計效率和一致性的強大工具。無論是新手還是經驗豐富的設計師，善用這個功能都可以大大減少重複勞動，提高專案的整體設計速度。
看更多
0 0 3050 0
職涯學習課程專文推薦
關注
104學習

產品

2024/10/21

前端/後端/全端工程師的必備工具與證照有哪些?相關懶人包整理
前端工程師需要掌握的技能和專業涵蓋了多個方面，包括基礎的網頁開發知識（ HTML、CSS 和 Java Script）、前端框架（ React.js、Vue.js 和 Angular．．等）、以及與團隊合作的工具等。以下是前端工程師的必備技能清單：
前端工程師
必備工具：
⭕ HTML/CSS/Java Script: 這三者是前端開發的基礎技能，用於設計和構建網站的視覺層。
⭕ React、Vue 或 Angular: 主流前端框架，幫助開發者更有效率地構建交互式網頁應用。
⭕ Git: 版本控制工具，幫助團隊協作並管理代碼變更。
⭕ Webpack、Parcel: 模組打包工具，優化前端資源的加載和編譯。
⭕ Figma、Sketch、Adobe XD: 設計工具，與設計師溝通並將設計轉換成實際前端代碼。
推薦證照：
⭕ Microsoft Certified: Azure Developer Associate: 如在雲端平台上進行前端開發，Azure的證書會讓你對雲端部署有更深的理解。
⭕ Google Mobile Web Specialist Certification: 專注於前端開發的移動端最佳實踐。
⭕ Certified Web Professional - Web Developer: 國際網頁專業人士協會頒發，涵蓋網頁開發的核心技能。
相關課程推薦：
Let’s Vue! 前端開發入門到實戰
成為前端工程師｜Java Script 入門：帶你逐步培養網頁開發技能
第一次就上手，前端工程新手指南
後端工程師
必備工具：
⚡ SQL（PostgreSQL、MySQL）及 NoSQL（MongoDB）: 數據庫管理技能是後端工程師的核心能力之一。
⚡ Node js、Python、Java 或 Ruby: 這些後端編程語言被廣泛用於構建伺服器端邏輯。
⚡ Docker、Kubernetes: 容器化技術和編排工具，用於構建、測試和部署應用程序。
⚡ RESTful APIs 和 GraphQL: 這些技術用於實現應用的後端與前端、第三方系統之間的通信。
⚡ CI/CD 工具: 自動化流程，確保代碼更快更安全地進入生產環境。
推薦證照：
⚡ AWS Certified Solutions Architect – Associate: 了解如何在AWS雲上設計和部署後端應用程式。
⚡ Microsoft Certified: Azure Administrator Associate: 若專注於Azure雲平台，這是不可錯過的證書。
⚡ Oracle Certified Professional, MySQL Database Administrator: 確保後端數據庫管理的穩定和高效運作。
推薦課程：
成為後端工程師 | 踏上程式起點，逐步掌握 Java 語言特性與物件導向程式設計
全端工程師
必備工具：
🔵 HTML/CSS/Java Script + React/Vue/Angular: 熟悉前端開發工具與框架，確保網頁的視覺與交互效果。
🔵 Node js、Express 或 Django: 這些是全端工程師通常選擇的後端框架，用於建立伺服器端邏輯。
🔵 Git、GitHub: 版本控制與協作工具，用於管理全端工程中的代碼。
🔵 Docker、CI/CD 工具: 幫助全端工程師部署整體應用，確保端到端流程的流暢運行。
🔵 GraphQL、RESTful APIs: 掌握API設計，讓前後端溝通順暢。
推薦證照：
🔵 AWS Certified Developer – Associate: 強化在雲端上開發全端應用的能力。
🔵 Certified Full Stack Developer: Coursera或Udacity上的全端開發認證，涵蓋從前端到後端的各項技能。
🔵 Google Cloud Professional Cloud Developer: 若專注於Google Cloud，這張證書能幫助掌握雲端環境下的全端開發技能。
工具與證書是工程師專業技能的一部分。無論你是專注於前端、後端還是全端開發，選擇合適的工具、掌握相關技能並考取相關證書，都是提升專業能力和職業發展的關鍵。保持學習的動力，不斷提升自我，是在快速變化的技術領域中保持競爭力的必備條件。
看更多
前端/後端/全端工程師的必備工具與證照有哪些?相關懶人包整理
nabi.104.com.tw
成為後端工程師 | 踏上程式起點，逐步掌握 Java 語言特性與物件導向程式設計－Java課程│104課程中心
0 0 5374 2
AI 趨勢報－科技愛好者的產地🤖
關注
知識貓星球

喵星人

2024/09/20

UIUX 設計師必備：IconKitchen 快速生成高品質 App icon 的免費 AI 工具｜功能優勢、使用教學
在設計App圖標時，你是否常為了調整不同平台的尺寸和格式而煩惱？IconKitchen 是一款專為解決這個問題的AI工具，能夠快速生成各種應用程式的圖標，無論是iOS、Android還是網站。這篇文章將介紹IconKitchen的功能優勢、使用教學以及費用方案，幫助你在短時間內輕鬆完成圖標設計，提升工作效率。
▍IconKitchen功能優勢
IconKitchen 是一款針對開發者和設計師的專業圖標生成工具，其最大的特色在於支援多平台圖標的快速製作。無論是iOS、Android（包含自適應圖標），還是網站的favicon或macOS應用程式圖標，IconKitchen 都能提供相對應的格式和尺寸。
▍IconKitchen的主要功能
● 自動生成多平台圖標：不再需要手動調整每個平台的圖標尺寸，只需一次設計，即可生成適合多種操作系統的圖標格式，包含自適應圖標和動態圖標。
● 圖標客製化：IconKitchen 提供多種圖標設計選項，使用者可以選擇不同的顏色、材質、以及預設的圖標模板，或者上傳自定義的圖片，快速生成高品質圖標。
● 簡單易用的介面：這款工具設計簡單易懂，即便你不是設計專業背景的人，也可以透過幾個簡單步驟完成圖標的設計和導出。
● 跨平台兼容性：支援iOS、Android、自適應圖標（Adaptive Icons）、網頁圖標（favicons）等多種平台，極大簡化了跨平台圖標設計的工作流程。
▍IconKitchen使用教學
使用IconKitchen 進行圖標設計的流程非常簡單。以下是使用這個工具的教學步驟：
● 訪問IconKitchen網站：首先，進入 IconKitchen 官方網站，這個工具不需要額外安裝軟體，完全在線操作。
● 選擇設計模板或上傳圖片：網站會提供多種預設的設計模板，你可以直接使用，也可以選擇上傳自己的圖片，進行個性化設計。
● 設定圖標的顏色和材質：在圖標生成過程中，你可以自訂圖標的顏色搭配和材質效果，這能讓你的圖標更具特色和品牌感。
● 導出圖標：當完成設計後，IconKitchen會自動生成適合不同平台的圖標格式。你可以下載這些圖標，直接使用於你的App或網站上。
▍icon生成 ai 的未來應用
隨著AI技術的進步，像IconKitchen這類自動化設計工具逐漸改變了設計師和開發者的工作方式。相比以往的手動調整，AI工具可以自動完成多平台圖標的調整，不僅提升了設計效率，也減少了人為錯誤的可能性。特別是在自適應圖標的處理上，IconKitchen 讓設計師不再需要煩惱複雜的技術細節，專注於圖標的創意表現。
這樣的工具未來很可能會逐漸整合更多的功能，例如圖標動畫、更多的客製化選項，甚至與其他設計軟體（如Figma、Sketch等）無縫對接，進一步簡化設計流程。
▍IconKitchen方案費用
IconKitchen 目前提供免費方案，使用者可以在不花費的情況下享受到其完整的圖標生成功能。根據其 產品頁面 的資訊，該工具目前不收取費用，這對於新創公司或小型開發團隊來說，是一個非常有吸引力的選擇。
儘管IconKitchen免費提供服務，未來可能會推出付費方案，以增加更多進階功能，例如更多的圖標模板、高級客製化選項，或是加速生成速度等服務。
總結
IconKitchen 是一款非常實用的 AI 圖標生成工具，能幫助設計師和開發者快速設計適合不同平台的高品質圖標。透過簡單易用的介面和多種客製化選項，你可以輕鬆完成圖標設計，省去繁瑣的手動調整過程。特別是對於初學者或時間有限的專業人士，IconKitchen的快速生成功能能大幅提升工作效率，幫助你專注於其他更重要的工作。
如果你正苦於多平台圖標設計的繁瑣步驟，或者希望提升你的設計效率，不妨嘗試一下IconKitchen，體驗AI帶來的設計便捷性！
➤ 立即使用：https://icon.kitchen
➤ 歡迎在104學習精靈關注【AI趨勢報－科技愛好者的產地】獲得更多科技新知！
看更多
UIUX 設計師必備：IconKitchen 快速生成高品質 App icon 的免費 AI 工具｜功能優勢、使用教學
icon.kitchen
IconKitchen
0 0 4203 5
不知如何開始學習嗎？ 先進行技能挑戰吧～
我要挑戰
我要應徵