デザインがほぼそのままWebサイトになる時代が来てるぞ...！ / Framer,WebflowでFigmaからそのままWebサイトを公開してみる

Figmaはコードとの融合が強いですね〜。
元々グラフィックツールというより、コードベースのデザインの垣根をなくすツールとして開発されているのでこの流れはすごく良いな〜と思います。

Figmaのオートレイアウト/コンポーネント機能を、一緒にUIトレースしながら学べるチュートリアル解説動画、ただ今製作中です...（コメントで応援して下さい）


❐ 紹介したサービス&使ったもの
-------------------------------------------
Figmaのデータ
https://www.figma.com/file/gHV5s00f34CJgfvN4daqDu/Figma-to-HTML-(framer-Webflow%EF%BC%89?node-id=23%3A149&t=frEY3c02ZMmdtBFn-1

紹介したキャリアの動画はこれです
https://youtu.be/Evwqe2OxJsA


Webflow
https://webflow.com/

Framer
https://www.framer.com/

Bitfrost
https://twitter.com/sathaxe/status/1625185603808821251



❐ BONOとは UIとUXのコミュニティ『BONO』
-------------------------------------------
デザイナーになりたい、デザインをもっと伸ばしたい。
成長速度は現場のプロに聞いて、仕事を見て学べば倍以上になります。し、同じ気持ちのメンバーと一緒に成長すればさらに上がります。

詳しくはこちら！参加お待ちしてます
https://www.bo-no.design/?utm_source=123022



❐ 目次
-------------------------------------------
00:00 Figmaすげー！
01:03 紹介するサービス
02:06 今回使うFigmaのデータ
02:33 Framer:コピペでWebサイト
05:57 Webflow:コピペでWebに
11:19 流れは実際のコードでも
12:39 作るだけやりたい人はコード理解必須です。




❐ 未経験からデザイナーになった人のインタビュー集
-------------------------------------------
BONOのメンバーのインタビューです。
こちらも参考に。
https://youtube.com/playlist?list=PLpe817jgOmIoLbiKbYZ8CmB7gLdc2pZxO


❐ UI/UXデザイナーになるためのロードマップ
-------------------------------------------
紹介したコンテンツはこちらにあります〜！
最初の「はじめてのUIデザイン」までは無料でできます?
https://www.bo-no.design/rdm/roadmap-uiuxdesigner2/?utm_source=123022





#Webデザイン #figma #webデザイナー