Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
神速でワイヤーフレームを作るためのライブラリ
Search
448jp | OKI Yoshiya
June 02, 2023
Design
1
860
神速でワイヤーフレームを作るためのライブラリ
2023/6/2 DIST.39 「みんなのFigma」
448jp | OKI Yoshiya
June 02, 2023
Tweet
Share
More Decks by 448jp | OKI Yoshiya
See All by 448jp | OKI Yoshiya
人はなぜコミュニティとつながると幸せを感じるのか
448jp
3
300
Webデザイナーが押さえておきたいエンジニアとの連携ポイント
448jp
0
3.7k
合意形成のためのFigma活用術
448jp
0
120
書く・即・DONEな仕組みをNuxtで作る
448jp
0
380
Figmaで神速ドキュメント作成術
448jp
3
2.5k
今から始めるFigma超入門
448jp
0
1.6k
零細Web制作会社のリモートワーク事情
448jp
0
420
エンジニアに120%意図を伝えるためのAdobe XDデザインテクニック
448jp
2
760
コーディングを神速化するJetBrains IDEのご紹介~基本機能からHTML/CSSまで~
448jp
0
340
Other Decks in Design
See All in Design
BPStudy#213〜ビジネスアナリシスとDDD(ドメイン駆動設計)パネルディスカッション資料 / BPStudy213-panel
haru860
0
450
バイアスを凌ぐデザインとコード ―異動直後にどうふるまうか―
kkaru
0
480
PF_濵村ひろみ_202503
maru_design78
0
200
株式会社Muture_ソーシャル推進事業
muture
PRO
0
110
“ブロック”で作る、WordPress制作フロー変革のすすめ
koots2021
4
1.9k
ランドマークが光る!季節を彩るナビ体験 - Mobility Night #3 -
kitau
0
100
企画を動かすデザイナーの思考!「広げて絞る」アプローチ。
hikidakan
0
130
実践ゼロから作らないデザインシステム SaaS × デザインシステム × プロダクトデザイン / Efficient Design System for SaaS—no need to start from scratch.
kaminashi
2
1.8k
Crisp Code inc. ブランドガイドライン
so_kotani
1
200
AIで加速するアクセシビリティのこれから
magi1125
3
590
真・altはつけるだけじゃなくて -alt属性の考察 2025年版-
securecat
5
1.6k
プロジェクト内でデザイナーができること 日経電子版アプリ機能開発「For You」#nikkei_tech_talk
nikkei_engineer_recruiting
8
4.2k
Featured
See All Featured
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
Documentation Writing (for coders)
carmenintech
72
4.9k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
130
19k
GitHub's CSS Performance
jonrohan
1031
460k
Building an army of robots
kneath
306
45k
We Have a Design System, Now What?
morganepeng
53
7.7k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
Statistics for Hackers
jakevdp
799
220k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
282
13k
For a Future-Friendly Web
brad_frost
179
9.8k
Imperfection Machines: The Place of Print at Facebook
scottboms
267
13k
Transcript
DIST.39 「みんなのFigma」 で を 作るための 神速 ワイヤーフレーム ライブラリ 合同会社世路庵 沖 良矢 | 2023.6.2
FRI
None
ワイヤーフレームとは ⚫ ウェブページを構成する要素を列挙した設計図 ⚫ 制作前に情報設計について共有・合意するために作ります ⚫ 視覚表現の質、使いやすさは担保しません
ワイヤーフレームの例
なぜFigmaで作る? チーム、クライアントの から みんなで作る ワイヤーフレームは作ったら終わりの一方通行な成果物ではありません。情報の順序、 重要度、分類、動線が適切かどうか、議論・検討を重ねて修正を繰り返します。世路庵 では職種に関わらずプロジェクトに携わる全員がワイヤーフレームにコミットします。
ワイヤーフレームの辛み ⚫ 作るときにスピード感が出にくい ⚫ 一定の品質を保つことが難しい ⚫ つい見た目の作り込みをしようとしてしまう
部品を組み合わせるだけで ワイヤーフレームができたら いいのに……
作りました (デモ)
ありがとうございました 合同会社世路庵 沖 良矢 @448jp