Skip to content

A framework that makes the first step of visual design flow and makes the foundation easier.

Notifications You must be signed in to change notification settings

woopsdez/spongecake-designmethod

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

7 Commits
 
 
 
 
 
 

Repository files navigation

スポンジケーキ デザインメソッドとは

イシジマ ミキによって提唱された、初学者向けデザイン手法。

センスや表現力が重要だと萎縮して、最初に一歩をどう踏み出していいか分からないノンデザイナーに向けて、「手順通りにステップを踏めば、基礎が完成する」手法として発案。

デコレーションが主要と勘違いされがちなグラフィックデザインが、実は「情報の整理」からはじまっていると理解してもらいやすい流れとなっている。

本稿で扱うデザインの範囲

  • グラフィックデザイン
  • ウェブデザイン
    • インターフェイス設計の前の情報デザイン

対象

  • デザインに興味がないが行う義務・予定がある人
  • 業務で簡単なデザインを行うことがある人
  • 自身の感性を信用できない人

目的

デザイン作業の中のセンス以外の部分を定型化する事。

「何が良くて何がいけないのか」自身の感性に自信がなく、制作や判断が難しいと考えている人が、デザインが必ず達成するべき項目の100点中50点がとれ、「完璧ではないが、間違いではない」デザインを実践できるようになることを目標にしている。

解決する課題

  • 感性による制作・評価の負担を軽減
  • デザイン作業の一部を定型化し、教えやすく

由来

デザインのロジック部分を定型化することでケーキの土台のように、

  1. 作りやすい
  2. 量産しやすい
  3. アウトソースしやすい
  4. コラボレーションしやすい
  5. アレンジしやすい
  6. 段重ねしやすい

ことをに由来する

スポンジケーキデザインメソッド

cake1: 情報を整理する

  • 近接と対比を繰り返す
    1. 情報を洗い出す
    2. 関連する情報を隣接させる(グループ化/近接)
    3. 優先順位をつける(ジャンプ率/対比)
    4. 決まった役割のあるものを定位置へ配置する
    5. それ以外のものを上から下へ順番に並べていく
    6. 配置したグループ内で2-4を繰り返していく
  • 最後に、整列と反復で整える

手習い 名刺を作成する


TODO

  1. cake1の作例を用意
  2. 原稿用意
  3. 素材用意
  4. フローに則って作業
  5. 動画収録
  6. アニメーションGIF化
  7. レビュー
  8. 本稿に掲載
  9. cakeになりそうなものを広く募る
  10. メール or メンションを受けられるようにする
  11. cakeを増やす
  12. cake化(定型化)できそうなデザイン中の作業をピックアップ
  13. フローを作ってみる
  14. 複数人でひとつの原稿をフローに則って作業する
  15. フィードバック → フローアップデート → ループ
  16. 複数の原稿を複数の人間がフローに則って作業する
  17. フィードバック → フローアップデート → ループ
  18. cake1と同様のフローで作例を用意する
  19. 英語版の原稿をつくる
  20. サイトを作る

コントリビューター募集

イシジマ ミキ | Twitter宛に、TODOのどの部分をコントリビューション可能かメンションください。

とくに、作例用のサンプル原稿を用意するのはすっごく苦手なので、手伝っていただけると非常に嬉しいです。

About

A framework that makes the first step of visual design flow and makes the foundation easier.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published