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

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

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
1
920

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

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

Avatar for 448jp | OKI Yoshiya

448jp | OKI Yoshiya

June 02, 2023
Tweet

More Decks by 448jp | OKI Yoshiya

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

Other Decks in Design

See All in Design
チームで事業価値を生み出す、プロアクティブなデザイナーになるための道のり/ Designship2025_Naya
Avatar for 株式会社ルート root_recruit
0
380
AIネイティブスタートアップにおけるプロダクト開発の新常識 / Product Development Tips in AI-Native Startups
Avatar for Jumpei Sakatsu saka2jp
2
960
デザインするために「多様性」について考える
Avatar for なつ iflection
0
200
「ツール」から「パートナー」へ。AI伴走時代のUXデザインとは？～操作を減らし、成果を最大にするための設計～
Avatar for NCDC ncdc
0
130
デザイナーがAIを使い倒して爆速プロダクト開発！社内ハッカソンでの取り組み紹介
Avatar for 都村　美帆 abokadotyann
9
3k
Ralph Penel Portfolio
Avatar for ralphpenel ralphpenel
0
280
デザインを信じていますか
Avatar for sekig(ojiee) sekiguchiy
1
970
組織はみんなでつくる。デザイナーが仕掛ける急拡大する組織のカルチャーづくり
Avatar for Kasumi Morita mkasumi
0
1.1k
root COMPANY DECK / We are hiring！
Avatar for 株式会社ルート root_recruit
2
26k
hicard_credential_202601
Avatar for hicard hicard
0
160
2026年の勢い / Momentum for 2026
Avatar for bebe bebe
0
350
結びながら、ひらく - にじむ境界のデザイン
Avatar for Hiroki Tani hilokifigma
3
1.4k

Featured

See All Featured
How to make the Groovebox
Avatar for あそなす asonas
2
1.9k
svc-hook: hooking system calls on ARM64 by binary rewriting
Avatar for Akira Moroo retrage
1
110
brightonSEO & MeasureFest 2025 - Christian Goodrich - Winning strategies for Black Friday CRO & PPC
Avatar for Christian Goodrich cargoodrich
3
110
We Are The Robots
Avatar for Honza Javorek honzajavorek
0
170
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
Avatar for Eileen M. Uchitelle eileencodes
38
2.7k
Highjacked: Video Game Concept Design
Avatar for Ryan Kendrick rkendrick25
PRO
1
290
Impact Scores and Hybrid Strategies: The future of link building
Avatar for Tamara Novitovic tamaranovitovic
0
210
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
Avatar for Tammy Everts tammyeverts
11
840
[SF Ruby Conf 2025] Rails X
Avatar for Vladimir Dementyev palkan
1
770
How to Grow Your eCommerce with AI & Automation
Avatar for Katarina Dahlin katarinadahlin
PRO
1
110
SERP Conf. Vienna - Web Accessibility: Optimizing for Inclusivity and SEO
Avatar for Sara Fernández Carmona sarafernandez
1
1.3k
The Power of CSS Pseudo Elements
Avatar for Geoffrey Crofte geoffreycrofte
80
6.2k

Transcript

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

    FRI
  2. None

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

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

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

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

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

  8. 作りました （デモ）

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