首頁(yè)技術(shù)文章正文

一線大廠案例:從0到1學(xué)Figma【Figma系統(tǒng)入門教程】

更新時(shí)間:2021-10-15 來(lái)源:黑馬程序員 瀏覽量:

  網(wǎng)上有句話說(shuō)的好,成功人士都是工具控,好的工具不僅能夠提升勞動(dòng)效率,連干活兒的心情都能好很多。

  Figma是一款更為先進(jìn)、更理解設(shè)計(jì)師工作方式和需求的界面設(shè)計(jì)工具。Figma讓設(shè)計(jì)師無(wú)需再考慮操作系統(tǒng)問題,也不需要管理插件、存儲(chǔ)、同步和協(xié)同等問題。讓設(shè)計(jì)師專注于設(shè)計(jì),為創(chuàng)造高效生產(chǎn)環(huán)境而生。

  從推出至今越來(lái)越受到 UI 設(shè)計(jì)師的喜愛,國(guó)內(nèi)也有很多的設(shè)計(jì)團(tuán)隊(duì)選擇了Figma。
  之前在網(wǎng)上看到一個(gè)說(shuō)法:If design tools were cars……

△ 圖片來(lái)自 Eddie‘s ***Twitter

  總結(jié)的非常準(zhǔn)確,Sketch像豐田的凱美瑞,有廣大群眾基礎(chǔ)的老牌廠商的經(jīng)典車型,而Figma則像Tesla一樣性能卓越,超越時(shí)代充滿未來(lái)感。

  Figma已蠶食PS、AI、Sketch……逐漸走上設(shè)計(jì)工具的主流地位,為了幫助UI新人,以及準(zhǔn)備轉(zhuǎn)到Figma平臺(tái)的設(shè)計(jì)師。


傳智教育重磅上新

《零基礎(chǔ)Figma系統(tǒng)入門教程》

簡(jiǎn)單高效,高薪進(jìn)大廠的實(shí)用技能


本套課程分為兩大部分:

一是基礎(chǔ)部分,目的是為了學(xué)習(xí)基礎(chǔ)工具以及高級(jí)命令的使用;

二是實(shí)戰(zhàn)部分,通過(guò)基礎(chǔ)部分的學(xué)習(xí),將其應(yīng)用在實(shí)戰(zhàn)工作項(xiàng)目中;

三是項(xiàng)目部分,精選大廠項(xiàng)目真實(shí)需求,提高學(xué)員解決問題能力。

既包含了系統(tǒng)化的新手入門教學(xué),又包含了大量實(shí)戰(zhàn)項(xiàng)目操作演示,最終達(dá)到對(duì)Figma平臺(tái)的全方面掌握。

課程研發(fā)遵循由簡(jiǎn)至繁、由淺至深的理念,授課方式通俗易懂,非常適合零基礎(chǔ)學(xué)員進(jìn)行學(xué)習(xí)。



 課程4大亮點(diǎn) 

1. 全網(wǎng)最全,最簡(jiǎn)單的Figma入門課程;

2. 講解由淺到深,沒有廢話,在最短時(shí)間教會(huì)最實(shí)用技術(shù);

3. 采用一線大廠真實(shí)需求驅(qū)動(dòng)知識(shí)的學(xué)習(xí),更清楚,更高效,更實(shí)用;

4. 大量的案例操作,即便是初學(xué)者也能迅速上手。


 課程內(nèi)容詳情 


 第一章 #  Figma基礎(chǔ)操作

01.Figma平臺(tái)介&課程內(nèi)容介紹

02.Figma安裝使用與漢化

03.Figma后臺(tái)界面總覽介紹

04.Figma工具欄 移動(dòng)工具

05.Figma工具欄 Frame與組的認(rèn)識(shí)

06.Figma工具欄 形狀工具

07.Figma工具欄 鋼筆工具

08.Figma工具欄 文字工具

09.Figma工具欄 預(yù)覽以及分享設(shè)置

10.Figma屬性欄 基礎(chǔ)功能講解(上)

11.Figma屬性欄 基礎(chǔ)功能講解(下)

12.Figma插件安裝與使用

13.Figma組件管理

14.Figma 組件、樣式團(tuán)隊(duì)推送管理

15.Figma 布局約束和柵格

16.Figma 自動(dòng)布局

 第二章 #  圖標(biāo)繪制實(shí)戰(zhàn)項(xiàng)目

01-磨砂圖標(biāo)繪制技法

02-微質(zhì)感圖標(biāo)技法

03-旋轉(zhuǎn)造型繪制技法

04-2.5D圖標(biāo)繪制技法

 第三章 #  APP項(xiàng)目實(shí)戰(zhàn)

01.APP項(xiàng)目實(shí)戰(zhàn)概述

02.常見項(xiàng)目框架搭建

03.標(biāo)簽欄組件制作

04-APP首頁(yè)排版(上)

05-APP首頁(yè)排版(下)

06-APP首頁(yè)完成

07-發(fā)現(xiàn)頁(yè)面制作

08-消息頁(yè)面制作

09-我的頁(yè)面制作

10-常規(guī)配圖添加方式

11-常規(guī)文字?jǐn)?shù)據(jù)添加方式

12-谷歌表格插件替換數(shù)據(jù)方法

13-數(shù)據(jù)采集器使用方式

14-項(xiàng)目組件庫(kù)搭建與整理

15-Figma自帶切圖工具使用

16-Figma自帶標(biāo)注功能

17-摹客平臺(tái)切圖標(biāo)注方案

18-頁(yè)面交互演示制作

19-APP套樣機(jī)方法






猜你喜歡:

UI設(shè)計(jì):3分鐘利用Photoshop制作五彩星軌

Photoshop快捷鍵大全

快速提升UI設(shè)計(jì)水平的簡(jiǎn)單實(shí)用技巧

AI立體標(biāo)題制作教程【Illustrator教程】

黑馬程序員UI/UE設(shè)計(jì)師培訓(xùn)課程

分享到:
在線咨詢 我要報(bào)名
和我們?cè)诰€交談!