Company Deck日本Japan16:9 · 29p

株式会社グラファー 会社紹介資料(プロダクト開発編)

株式会社グラファーの会社紹介資料 — 資料デザインの参考

元の資料を見るspeakerdeck.com
株式会社グラファー「株式会社グラファー 会社紹介資料(プロダクト開発編)」の1ページ目(表紙)
表紙
01 / 06
出典: 株式会社グラファー「株式会社グラファー 会社紹介資料(プロダクト開発編)」(speakerdeck.com)。解説のために一部のページ(6枚)を縮小して引用しています。全ページは元の資料でご覧ください。

Editor's note — 編集部の視点

左端に紫の細い柱が1本、全ページを通っている。

グラファーの会社紹介資料(プロダクト開発編)は、紫1色とM PLUS 1pの太字だけで組み、箱と見出し帯の繰り返しで開発の考え方を段取りよく読ませる。

LunaType & Whitespace
M PLUS 1pの太字で本文まで押し切ってるの、潔い。字面が大きい書体だから、37pxでも行が間延びしない。見出しの上の短い線も地味に効いてる。字間はもう少し開けたいけど。
  • 1左端の紫の柱にページ番号、左下にロゴ。本文の型が毎ページ同じで、読む場所を探さない
  • 2本文は1920px換算で37pxと大きめ。箇条書きが続いても、画面共有で文字がつぶれない
  • 3中扉は画面の左6割を紫で塗るだけ。白い本文ページとの落差で、章の変わり目が伝わる

Measured

判型・余白・文字量(実測)

本文・見出しを置く範囲
余白(1920px換算)
上56 右158 下109 左112
1枚の文字量
中央値 約231字
多いページ
約598字
写真・画像の面積
全面に画像(判定不可)

公開PDFの29ページから計測。余白は本文サイズ以上の文字を置く範囲の外側です(ページ番号などの小さな文字は端から 上55・下84・左14・右63px)。

Color

配色

実測の面積比(代表ページ)

本文の文字色と背景のコントラスト: 1.5:1

Typography

書体と文字サイズ(実測)

和文の見出し・本文(Bold / Regular)

使用
M PLUS 1p
代替
M PLUS 1p

和文の見出し・本文の一部(Bold / Regular)

使用
M PLUS 1
代替
M PLUS 1

PDFに埋め込まれた書体: MPLUS1p-Bold(46%)、MPLUS1-Bold(29%)、MPLUS1p-Regular(16%)、MPLUS1-Regular(8%)

  • 表紙・中扉の大見出し資料の型 Aa108px · PPT 54pt
  • ページ見出し資料の型 Aa53px · PPT 27pt
  • 本文資料の型 Aa37px · PPT 19pt
  • 注釈・出典資料の型 Aa32px · PPT 16pt

px は横1920pxに換算した値。見本は半分の大きさで表示しています。

Page types

ページの型

  1. 出典: 株式会社グラファー「株式会社グラファー 会社紹介資料(プロダクト開発編)」p.1

    表紙

    全面を紫で塗り、右側に一段明るい紫の角丸の図形を斜めに重ねる。左にロゴを小さく、題名を白の太字で1行。装飾は図形の重なりだけにとどめる。

  2. 出典: 株式会社グラファー「株式会社グラファー 会社紹介資料(プロダクト開発編)」p.6

    中扉

    画面の左6割を紫の面、右を白のまま残す。紫の面に章題を白抜きで1行、右下にロゴの記号を大きく置いて、白い余白に重しをつける。

  3. 出典: 株式会社グラファー「株式会社グラファー 会社紹介資料(プロダクト開発編)」p.7

    本文

    2列×2段の白い箱に紫の枠をつけ、各箱の頭に紫の小見出しを置く。中身は黒丸の箇条書き3行。左上に章題と一行の要約を添える。

  4. 出典: 株式会社グラファー「株式会社グラファー 会社紹介資料(プロダクト開発編)」p.15

    メッセージ

    白地の中央に1行だけ大きく置き、前半を灰色、後半のキーワードを紫にして下線を引く。色の切り替えで、言いたい語だけを浮かせる。

  5. 出典: 株式会社グラファー「株式会社グラファー 会社紹介資料(プロダクト開発編)」p.16

    比較・表

    2つの考え方を左右に並べ、それぞれの頭に紫の帯で名前を置く。中身は箇条書きで行数をそろえ、比べる軸がずれないようにする。

  6. 出典: 株式会社グラファー「株式会社グラファー 会社紹介資料(プロダクト開発編)」p.17

    図解

    縦長の箱を3列並べ、頭の紫の帯の下に下向きの三角を置く。見出し、一言、本文の順に下へ流し、3つのメリットを同じ型で読ませる。

Reproduce

この型で資料を作るには

  • 01色は紫(#4616b8)1色と灰色だけ。強調したい語だけ紫にする
  • 02左端に紫の細い柱、左上にページ番号、左下にロゴを必ず置く
  • 03見出しの上に短い黒の線を1本。見出し53px・本文37px前後(1920px換算)
  • 04箱は白地に紫の枠と紫の見出し帯。中身は箇条書きで3〜4行
  • 05書体はM PLUS 1pとM PLUS 1のBold・Regularに絞る
  • 06左端の紫の柱・ページ番号・ロゴをマスターに入れ、本文ページの型を1つにする
  • 07箱の見出しは紫の帯、中身は黒の箇条書きで統一する
  • 08言いたい一文のページは中央に1行だけ置き、キーワードだけ紫に変える
  • 09中扉は画面の6割を紫で塗り、白い本文ページと明暗の差をつける

スライドのデザイン分析MDに含まれるもの

実測の判型・余白・文字サイズ(PowerPoint / Google スライドの pt 換算つき)・文字量 / カラートークンとコントラスト / ページの型 / AIっぽさを消すルール / Claude・ChatGPT・Gemini 用の生成プロンプト / Web資料(HTMLスライド)の実装方針 / 盗用を避ける差し替えリスト(Pro: 色・文字・余白を反映済みの Web資料のひな形・Marp テーマCSS・tokens.json)

株式会社グラファー 会社紹介資料(プロダクト開発編)についてよくある質問

グラファーの会社紹介資料のデザインの特徴は?

左端に紫の細い柱を通し、紫1色の見出し帯と白い箱で本文を組んでいます。中扉だけ画面の左6割を紫で塗り、章の区切りを示しています。

どんなフォントを使っている?

M PLUS 1p と M PLUS 1 の Bold・Regular で、文字量のほぼすべてを占めます。どちらも無料で使えます。本文は1920px換算で37px前後と大きめです。

何ページある?

16:9の横長で29ページです。1ページの文字数は中央値231字です。

安心してお使いいただくために

引用の範囲で掲載
代表ページ数枚を縮小して、解説と実測値に添えています。出典と元資料へのリンクを必ず表示します。
PDF・画像は配布しません
資料そのもののダウンロードは提供していません。原本は公開元のページでご覧いただけます。
MDは数値と構造だけ
デザイン分析MDに、元資料の文章・画像・図版は含みません。差し替え必須のものも明記しています。
人物写真に配慮
一般の社員・来場者など、私人が大きく写るページは掲載しません。

著作権・商標は各権利者に帰属します。権利者の方からの取り下げ・修正のご依頼は、原則2営業日以内に対応します。取り下げ・修正を依頼する