Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

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

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
Avatar for 448jp | OKI Yoshiya 448jp | OKI Yoshiya
June 02, 2023
Design
980
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
Vue Fes Japan 2026 タイムテーブル徹底解説
Avatar for 448jp | OKI Yoshiya 448jp
1
890
今から始めるClaude Code超入門
Avatar for 448jp | OKI Yoshiya 448jp
8
11k
人はなぜコミュニティとつながると幸せを感じるのか
Avatar for 448jp | OKI Yoshiya 448jp
3
540
Webデザイナーが押さえておきたいエンジニアとの連携ポイント
Avatar for 448jp | OKI Yoshiya 448jp
0
4.4k
合意形成のためのFigma活用術
Avatar for 448jp | OKI Yoshiya 448jp
1
290
書く・即・DONEな仕組みをNuxtで作る
Avatar for 448jp | OKI Yoshiya 448jp
0
490
Figmaで神速ドキュメント作成術
Avatar for 448jp | OKI Yoshiya 448jp
3
2.9k
今から始めるFigma超入門
Avatar for 448jp | OKI Yoshiya 448jp
0
1.8k
零細Web制作会社のリモートワーク事情
Avatar for 448jp | OKI Yoshiya 448jp
0
580

Other Decks in Design

See All in Design
decksh object reference
Avatar for Anthony Starks ajstarks
2
1.8k
富山デザイン勉強会_生成AIを使ったデザイン制作2026最新版.pdf
Avatar for keita keita_yoshikawa
0
190
Starfall (2025)
Avatar for Rachel Poon rezaline
0
170
HeartLanguage - DesignProcess
Avatar for HeartLanguage heartlanguage
0
250
JBUG大阪#9_登壇資料_引き継ぎで困らないためのBacklogWikiの整え方_ミスと属人化を防ぐために、 “次の人が動ける状態”をどう残すか
Avatar for Beeworks Marketing Design webnaut
2
290
デザインレビューを「他者へのおすそわけ」に再定義し、たのしい場にする試み
Avatar for Beeworks Marketing Design webnaut
1
130
Jun Wei Portfolio 2026
Avatar for Wong Jun Wei wjw100788
PRO
1
370
自社プロダクトのUIをAIが再現するデザインビルドシステム
Avatar for toy toy1618
0
1.3k
エンジニアでも捗る デザイナー的思考入門(bitA Edit 新ver)
Avatar for Tsubasa SEKIGUCHI tinykitten
1
650
Rondo 1 Minute Short Storyboard
Avatar for Rachel Poon rezaline
0
120
2026/8/20　Polaris15周年イベント 『共創の場をつくる』 〜 誰もが『心地よく暮らし、心地よくはたらく』ことを選択できる社会へ 〜 関係性から地域をつくりなおす共創の土壌づくり 〜リビングラボの事例を通じて〜
Avatar for Kimura Atsunobu a2k
0
110
AI-Slopなデザインを生まないためのデザインプロセス戦略
Avatar for takanorip takanorip
10
6.3k

Featured

See All Featured
技術選定の審美眼（2025年版） / Understanding the Spiral of Technologies 2025 edition
Avatar for Takuto WADA twada
PRO
120
120k
What’s in a name? Adding method to the madness
Avatar for The Alliance productmarketing
PRO
24
4.2k
The Web Performance Landscape in 2024 [PerfNow 2024]
Avatar for Tammy Everts tammyeverts
12
1.3k
Making the Leap to Tech Lead
Avatar for Ryan Cromwell cromwellryan
135
10k
Leveraging LLMs for student feedback in introductory data science courses - posit::conf(2025)
Avatar for Mine Cetinkaya-Rundel minecr
1
440
Designing Powerful Visuals for Engaging Learning
Avatar for Mike Taylor tmiket
1
610
The #1 spot is gone: here's how to win anyway
Avatar for Tamara Novitovic tamaranovitovic
4
1.2k
Rebuilding a faster, lazier Slack
Avatar for samanthasiow samanthasiow
85
9.7k
Exploring anti-patterns in Rails
Avatar for Elle Meredith aemeredith
4
540
Evolving SEO for Evolving Search Engines
Avatar for Ryan Jones ryanjones
0
330
Paper Plane
Avatar for Katie Cordina Lindsey katiecoart
PRO
5
54k
Claude Code どこまでも/ Claude Code Everywhere
Avatar for nwiizo nwiizo
68
59k

Transcript

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

    FRI
  2. None

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

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

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

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

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

  8. 作りました （デモ）

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