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

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

Avatar for 448jp | OKI Yoshiya 448jp | OKI Yoshiya
June 02, 2023
Design
1
900

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

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
人はなぜコミュニティとつながると幸せを感じるのか
Avatar for 448jp | OKI Yoshiya 448jp
3
350
Webデザイナーが押さえておきたいエンジニアとの連携ポイント
Avatar for 448jp | OKI Yoshiya 448jp
0
4.1k
合意形成のためのFigma活用術
Avatar for 448jp | OKI Yoshiya 448jp
0
180
書く・即・DONEな仕組みをNuxtで作る
Avatar for 448jp | OKI Yoshiya 448jp
0
410
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
460
エンジニアに120%意図を伝えるためのAdobe XDデザインテクニック
Avatar for 448jp | OKI Yoshiya 448jp
2
790
コーディングを神速化するJetBrains IDEのご紹介～基本機能からHTML/CSSまで～
Avatar for 448jp | OKI Yoshiya 448jp
0
360

Other Decks in Design

See All in Design
「デザイン」の自分ごと化から始める、デザインピープルのふるまい
Avatar for mewmo mewmo
PRO
0
100
プロダクトリニューアルと同時に進める初めてのデザインシステム
Avatar for PERSOL CAREER Dev | techtekt techtekt
PRO
0
380
そのUIコンポーネント、これから先も使えますか？―Headless UI,Open UI,グローバルデザインシステム
Avatar for sakito sakito
2
2.5k
これからの「Webデザイン」の話をしよう～デザイナーの私が考えるブロックテーマへの対応で変わりゆくデザインの価値～
Avatar for ミヤケアツシ ds35mm
0
480
デザイナーがAIを使い倒して爆速プロダクト開発！社内ハッカソンでの取り組み紹介
Avatar for 都村　美帆 abokadotyann
9
2.9k
maki setoguchi
Avatar for Maki / Web Designer maki_setoguchi
0
620
AIエージェントが対話的なUIを返す！MCP−UIで変わるユーザ体験
Avatar for daitasu daitasu
1
110
TUNAG BOOK 2024
Avatar for 株式会社スタメン stmn
0
1.3k
AI時代に問われる、リサーチの感受性──地域⇄大企業の現場から見えた「違和感」との向き合い方
Avatar for Muture muture
PRO
0
390
ドルちゃん
Avatar for ドルちゃん design_dolphins
0
530
見過ごさない誠実さ_アクティブバイスタンダーとIntegrityが支えるアジャイル文化 / integrity-and-active-bystander
Avatar for Aki spring_aki
1
270
逆向きUIの世界 〜iOSアプリのRTL言語対応〜
Avatar for akatsuki174 akatsuki174
1
370

Featured

See All Featured
What's in a price? How to price your products and services
Avatar for Michael Herold michaelherold
246
13k
Unsuck your backbone
Avatar for Amy Palamountain ammeep
671
58k
A Soul's Torment
Avatar for Nat Ma seathinner
2
2.1k
How To Stay Up To Date on Web Technology
Avatar for Chris Coyier chriscoyier
791
250k
How STYLIGHT went responsive
Avatar for nonsquared nonsquared
100
6k
The agentic SEO stack - context over prompts
Avatar for schlessera schlessera
0
580
Why Mistakes Are the Best Teachers: Turning Failure into a Pathway for Growth
Avatar for Umar Saidu Auna auna
0
35
Save Time (by Creating Custom Rails Generators)
Avatar for Garrett Dimon garrettdimon
PRO
32
1.9k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
Avatar for Stéphanie Walter stephaniewalter
287
14k
Practical Tips for Bootstrapping Information Extraction Pipelines
Avatar for Matthew Honnibal honnibal
25
1.7k
Speed Design
Avatar for Sergey Chernyshev sergeychernyshev
33
1.5k
Digital Projects Gone Horribly Wrong (And the UX Pros Who Still Save the Day) - Dean Schuster
Avatar for UX Y'all uxyall
0
120

Transcript

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

    FRI
  2. None

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

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

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

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

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

  8. 作りました （デモ）

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