Upgrade to Pro — share decks privately, control downloads, hide ads and more …

神速でワイヤーフレームを作るためのライブラリ

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for 448jp | OKI Yoshiya 448jp | OKI Yoshiya
June 02, 2023
Design
950
1

 神速でワイヤーフレームを作るためのライブラリ

2023/6/2 DIST.39 「みんなのFigma」

Avatar for 448jp | OKI Yoshiya

448jp | OKI Yoshiya

June 02, 2023

More Decks by 448jp | OKI Yoshiya

See All by 448jp | OKI Yoshiya
今から始めるClaude Code超入門
Avatar for 448jp | OKI Yoshiya 448jp
8
11k
人はなぜコミュニティとつながると幸せを感じるのか
Avatar for 448jp | OKI Yoshiya 448jp
3
410
Webデザイナーが押さえておきたいエンジニアとの連携ポイント
Avatar for 448jp | OKI Yoshiya 448jp
0
4.3k
合意形成のためのFigma活用術
Avatar for 448jp | OKI Yoshiya 448jp
1
230
書く・即・DONEな仕組みをNuxtで作る
Avatar for 448jp | OKI Yoshiya 448jp
0
450
Figmaで神速ドキュメント作成術
Avatar for 448jp | OKI Yoshiya 448jp
3
2.8k
今から始めるFigma超入門
Avatar for 448jp | OKI Yoshiya 448jp
0
1.8k
零細Web制作会社のリモートワーク事情
Avatar for 448jp | OKI Yoshiya 448jp
0
520
エンジニアに120%意図を伝えるためのAdobe XDデザインテクニック
Avatar for 448jp | OKI Yoshiya 448jp
2
830

Other Decks in Design

See All in Design
デザイナーが主導権を握る、AI協業の本音と実践
Avatar for satosio satosio
7
3.2k
「デザイン」の自分ごと化から始める、デザインピープルのふるまい
Avatar for mewmo mewmo
0
230
デザイナーとエンジニアで 同じ山に登ろう
Avatar for moco moco1013
0
220
図面資産×AI 眠れる資産を起こす挑戦
Avatar for 青野正寛 aonomasahiro
0
110
AIエージェントが対話的なUIを返す！MCP−UIで変わるユーザ体験
Avatar for daitasu daitasu
1
200
AIでデザインをつくる：基礎編
Avatar for 太田賢一 kenichiota0711
4
3k
Drawing for Animation
Avatar for Mandalyn Teo lynteo
2
290
Storyboard Exercise: Chase Sequence
Avatar for Mandalyn Teo lynteo
1
300
root COMPANY DECK / We are hiring！
Avatar for 株式会社ルート root_recruit
2
28k
I.A. como meio, não como fim. Dados + IA e até onde vai a promessa?
Avatar for Viviane Delvequio videlvequio
0
280
富山デザイン勉強会_デザイントレンド2026.pdf
Avatar for keita keita_yoshikawa
3
180
コンテンツ作成者の体験を設計する
Avatar for Chiaki Okamoto chiilog
0
150

Featured

See All Featured
The Curious Case for Waylosing
Avatar for Cassini Nazir cassininazir
0
340
Practical Tips for Bootstrapping Information Extraction Pipelines
Avatar for Matthew Honnibal honnibal
25
1.9k
Navigating the moral maze — ethical principles for Al-driven product design
Avatar for Skipper Chong Warson skipperchong
2
350
Context Engineering - Making Every Token Count
Avatar for Addy Osmani addyosmani
9
860
YesSQL, Process and Tooling at Scale
Avatar for Rocio Delgado rocio
174
15k
Tips & Tricks on How to Get Your First Job In Tech
Avatar for Honza Javorek honzajavorek
1
500
AI Search: Implications for SEO and How to Move Forward - #ShenzhenSEOConference
Avatar for Aleyda Solis aleyda
1
1.2k
Primal Persuasion: How to Engage the Brain for Learning That Lasts
Avatar for Mike Taylor tmiket
0
330
エンジニアに許された特別な時間の終わり
Avatar for watany watany
106
240k
Bridging the Design Gap: How Collaborative Modelling removes blockers to flow between stakeholders and teams @FastFlow conf
Avatar for Kenny Baas-Schwegler baasie
0
540
How To Stay Up To Date on Web Technology
Avatar for Chris Coyier chriscoyier
790
250k
Why You Should Never Use an ORM
Avatar for John Nunemaker jnunemaker
PRO
61
9.8k

Transcript

  1. DIST.39 「みんなのFigma」 で を 作るための 神速 ワイヤーフレーム ライブラリ 合同会社世路庵　沖 良矢　|　2023.6.2

    FRI
  2. None

  3. ワイヤーフレームとは ⚫ ウェブページを構成する要素を列挙した設計図 ⚫ 制作前に情報設計について共有・合意するために作ります ⚫ 視覚表現の質、使いやすさは担保しません

  4. ワイヤーフレームの例

  5. なぜFigmaで作る？ チーム、クライアントの から みんなで作る ワイヤーフレームは作ったら終わりの一方通行な成果物ではありません。情報の順序、 重要度、分類、動線が適切かどうか、議論・検討を重ねて修正を繰り返します。世路庵 では職種に関わらずプロジェクトに携わる全員がワイヤーフレームにコミットします。

  6. ワイヤーフレームの辛み ⚫ 作るときにスピード感が出にくい ⚫ 一定の品質を保つことが難しい ⚫ つい見た目の作り込みをしようとしてしまう

  7. 部品を組み合わせるだけで ワイヤーフレームができたら いいのに……

  8. 作りました （デモ）

  9. ありがとうございました 合同会社世路庵　沖 良矢 @448jp