Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Amebaブログ Brand Guidelines
Search
Ameba Spindle
June 08, 2023
Design
43k
5
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Amebaブログ Brand Guidelines
Ameba Spindle
June 08, 2023
More Decks by Ameba Spindle
See All by Ameba Spindle
Spindle 2025: How AI Agents and Design Systems Are Transforming Web Development
spindle
0
94
MCPで変わる Amebaデザインシステム「Spindle」の開発
spindle
2
4.3k
デザインシステムの力 Webデザイナーとエンジニアのための実践ガイド / The Power of Design System
spindle
10
11k
Ameba Illustration Guidelines
spindle
2
830
Amebaデザインシステム Spindleの開発 / The Development of Spindle
spindle
6
3.2k
Spindle UIのつくりかた / Spindle UI: From Concept to Creation
spindle
5
9.3k
Other Decks in Design
See All in Design
改正JISを見据えた、企業のアクセシビリティ対応ロードマップ
securecat
1
390
AI時代、デザイナーの価値はどこに?
tararira
2
1.1k
30分でわかるインサイトマネジメント(2025年12月バージョン)
centou
1
660
Design dependencies
teba_eleven
0
120
「ツール」から「パートナー」へ。AI伴走時代のUXデザインとは?~操作を減らし、成果を最大にするための設計~
ncdc
1
650
Storyboard Exercise: Chase Sequence
lynteo
1
320
コムデマネージャーがプロダクトデザインに挑戦した。むずかしくて楽しかった。
payatsusan213
0
310
TUNAG BOOK 2024
stmn
PRO
0
1.6k
Figma MCPを活用するためのデザインハンドブック
vivion
7
18k
情報を翻訳する-伝わる可視化3原則とオープンデータ活用-
hjmkth
1
260
2026年、デザイナーはなにに賭ける?
0b1tk
0
560
「見せる」登壇資料デザインの極意
takanorip
3
980
Featured
See All Featured
Typedesign – Prime Four
hannesfritz
42
3.1k
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
aleyda
1
2k
The SEO Collaboration Effect
kristinabergwall1
1
480
The Power of CSS Pseudo Elements
geoffreycrofte
82
6.3k
Evolving SEO for Evolving Search Engines
ryanjones
0
210
Agile that works and the tools we love
rasmusluckow
331
21k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
9
1.4k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
16
2k
Measuring Dark Social's Impact On Conversion and Attribution
stephenakadiri
2
210
Navigating Algorithm Shifts & AI Overviews - #SMXNext
aleyda
1
1.3k
Jess Joyce - The Pitfalls of Following Frameworks
techseoconnect
PRO
1
160
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
25
1.9k
Transcript
Brand Guidelines
Introduction
はじめに ブランドとは、様々な体験の蓄積の結果、人々の心の中に作られるイメージや期待のことです。それは、サービス や企業が発信するあらゆるコミュニケーションや制作物すべてを通して形成されていきます。したがって、ブラン ド創りにはすべての制作物において一貫した体験とそこから感じられる印象でコミュニケーションする必要があり ます。 Amebaは長年にわたり、インターネット上における個人の発信や価値あるコンテンツを届けるプラットフォーム としてサービスを提供してきました。 「Ameba Brand Guidelines」は、制作者、広告主、取引先などあらゆる関係者との接点において私たちの誰も
が一貫したコミュニケーションを行い、“Amebaらしさ”を共に創り上げるための指針です。 3 Ameba Brand Guidelines ブランドとは 人々の心に中にあるイメージ、印象、らしさ
ブランディングとは? ブランディングとは、企業や商品、サービスなどの“らしさ”を、時代やニーズなどを捉えながら、ビジュアルや体 験を通して社内外に一貫して伝え、届けていくことです。ブランドに共感してもらい、ファンになってもらうこと がブランディングの目的です。ブランディングによって創られたブランド価値は、企業やサービスの資産にもなっ ていきます。 4 Ameba Brand Guidelines BRAND
なぜ、なんのために存在しているのか? 〇〇らしさ 意志・歴史・理念・強み・特徴・独自性 ロゴ・カラー・音・言葉・ 空間・活動・社員・体験 どんな方法で伝え、届け、 心の中に醸成させるか? らしさ 届け方 ING ※参考文献:Landor 事例で学ぶブランディング
ブランディングの役割 ブランドのあるべき姿を定義することによって組織やサービスが目指す方向性に一貫性が生まれ、 「ブランドのらしさ」が明確に伝わります。 5 Ameba Brand Guidelines SNS 広告 広報/PR
社員 プロダクト 値段 Brand
ビジョン、ミッション、コンセプトの相関関係 ビジョン、ミッション、コンセプトを定義することによって目指す指針が明確になります。 6 Ameba Brand Guidelines ブランドアイデンティティ Brand Identity ブランドが持つべき個性や印象
Amebaらしさ Vision ビジョン 理想とする姿の追求 Mission ミッション 存在意義、社会的意志 ブランドコンセプト Concept らしさを体現するための実行原理
ブランドガイドラインの位置付け Amebaブランドガイドラインは、「サービスとしてのAmeba」のブランドについて規定しています。本ガイドラ インがAmeba全体のブランディングの核となり、すべてのプロダクトやサービスに対して上位の指針となりま す。 一方で、各プロダクト、サービスで本ガイドラインには書かれていない個別ルールが必要になる場合がありま す。サービスの個性を踏まえた個別のガイドラインを作る場合は、本ガイドラインとの整合性を保つように留意し てください。 7 Ameba Brand
Guidelines Visoin Mission Concept Brand Identity DesignSystem & Guidelines Service & Product サービスブランドの 核となる理念 あらゆるタッチポイントにおける サービスブランドの特徴を表すもの 本ガイドラインを踏まえたブラン ド・プロダクトのガイドライン ユーザーとのタッチポイントとなる サービスやプロダクト
Vision Mission
ビジョン 理想とする姿の追求 9 Ameba Brand Guidelines Brand Vision / Slogan
- 理想とする姿
ミッション 存在意義、社会的意志 10 Ameba Brand Guidelines Brand Mission - 存在意義
社会的意思 人 と 情報をつ むぎ 暮 ら しが豊かに育ちつづ ける た め の機会をつくる。
Brand Identity
ブランドアイデンティティとは ブランディングにおいて核となるのがブランド・アイデンティティ、つまり「らしさとは何か」という定義です。 それはコピーやロゴに限らず、サービスの提供価値やブランドパーソナリティ、ベネフィット、ボイス&トーンな どによって形成されており、その“らしさ”を体現するための実行原理として「Brand Concept」があります。ブラ ンドを創るためには、この“らしさ”をすべてのタッチポイントにおいて、一貫して届ける必要があります。 12 Ameba Brand Guidelines
らしさ
ブランドコンセプト 目指す世界観、らしさを体現するための実行原理 13 Ameba Brand Guidelines Brand Concept 生きたコンテンツをつむぐ その人らしさ、感情、気持ちがありのままに書かれたブログ。
心を揺さぶる漫画や、励ましてくれる占い。 Amebaにあるのは、そんな「生きたコンテンツ」です。 さまざまなコンテンツとAmebaで出会い、その時の心情をブログにつづる。 そのブログを見た誰かが、また新しい価値にめぐりあう。 人とコンテンツが出会い、想いをつむぐ、一人ひとりの心が豊かになる場所。 Amebaはそんなサービスを、100年先まで提供していきます。
ブランドコンセプト 目指す世界観、らしさを体現するための実行原理 14 Ameba Brand Guidelines 記事を生み出す 届ける つながれる 等身大
多様性 親しみやすい、多様性がある 生きたコンテンツをつむぐ Brand Concept ブロガー 閲覧者 その人らしい 生きたことば 心が動く
ブランドコア Amebaが大事にしたい価値観 ここで定義しているブランドコアとはユーザーに感じてもらいたいAmebaの価値です。 Amebaらしさを体現するために重要な価値基準になります。 15 Ameba Brand Guidelines Amebaは 等身大でいられる
等身大でいられる、本音が言える 飾らずにありのままの自分で楽しめる、 居心地のいい場所。 Amebaは 多様性がある 個性と個性が混じり合う ユーザー、コンテンツが互いに尊重される、 みんなの日常を彩る場所。 Amebaは 親しみやすい 誰にでもなじむ、寄り添える 若い人からお年寄りまで、 すべての人にとって親しみやすい場所。 Amebaは つながれる 思いがけないうれしい出会いが、ここに。 予期せぬ発見やつながりが ユーザーの世界を広げる場所。 Brand Core
ブランドパーソナリティ ブランドが持つべき人格(個性や印象) 定義したブランドパーソナリティによって、消費者はブランドを明確に認識できるようになります。例えば、 Amebaというブランドが消費者にとってどのような存在であるかを定義することにより、ブランドの個性や性格 が明示されます。これにより、ブランドの思考や行動、態度などが自然と明確になり、その結果、発信するメッ セージ全体が一貫性を持つようになります。 16 Ameba Brand Guidelines
明るく楽しい雰囲気を持ち、人懐っこさも兼ね備えている。 知識に満ち、しっかりとした価値観を保有している。 誰に対しても対等に接し、親友のようにそばに寄り添う存在。 どんな感じのする人? 明るく陽気で親しみやすく、誰からも愛される友人の ような存在。ユーモアを理解し、常に自然体で公平。 どんな見た目の人? 手の届く範囲のおしゃれ。きれいさが過剰にならず、 愛嬌があり、話しかけやすい雰囲気を持つ どんな話をする人? 誠実に、本音でリアルな情報を伝える。豊富な知識を 持ち、多角的な視点から情報を伝達する。場の空気や 相手に合わせた適切な口調で会話を進める。 どんな振る舞いの人? 自然体のままで、親身になって寄り添う。幅広い関心 を持ち、強固な価値観を保つ。人の話を良く聞き、他 人を尊重する態度を持つ。 どんな夢を持っている? みんながそれぞれの多様性を認め合い、自分らしく在 ることができる状態を願っています。その結果として 心が豊かになれば嬉しいと思っていまる。 その他 流行に繊細で、最新のトレンドを上手に取り入れてい る。また、多くの友人がいる。
ブランドターゲット 理想とするターゲット像 ブランドターゲットとは、特定のブランドが商品やサービスを提供する際に重点的に取り組もうとする特定の顧客 層のことを指します。これは年齢層、性別、生活スタイル、趣味、所得レベルなどによって判断されます。ブラン ドターゲットを明確にすることで、マーケティング戦略や商品開発、サービス提供などをより効果的に行うことが できます。 17 Ameba Brand Guidelines
書き手 ありのままの自分で発信したい人 共感してくれる人と深くつながりたい人 読み手 趣味趣向にあったリアルな情報を知りたい人 同じ境遇の人の情報で共感、安心を得たい人
ボイス & トーン Amebaはどのような喋り口調で情報を伝えるのか? 「ボイス&トーン」とは、ブランドがどのような言葉遣いをするのか、どんな話し方をするのかを表すものです。 これはブランドパーソナリティを基に定められ、そのブランドが具現化した場合の口調や言葉遣いをイメージさせ ます。全ての発言がこのボイス&トーンに統一されることで、ブランド全体のイメージが一貫性を持つようになり ます。 18 Ameba
Brand Guidelines 正直 寛容 親切 温和 性格 親しみやすい ほがらか 包み込むような 知らせる おすすめする 共感する 満足してもらう 明確な 知識豊かな 難しくない 口調、雰囲気 目的 言語、言葉使い Brand Voice 真剣 楽しい フォーマル カジュアル ビジネスライク リラックス 落ちついた 活気のある 聞き慣れた ユニーク 大人な 若々しい
Design Principles
Amebaらしさ3原則 らしさを体現するための約束事 概要 Amebaらしさ3原則とはAmebaでモノづくりをするために必要な、Amebaらしさ = ブランドを体現するための 「約束事」です。 役割と効果 Amebaらしさ3原則では、Amebaが「どのような」ブランドを目指すのかを方向づける言葉を定義しています。 3原則を意識して、Amebaらしさを体現することにより、パートナーやユーザーに対して一貫した体験を届けられ
るようになります。 20 Ameba Brand Guidelines Amebaらしさ 敬意を表そう 快く迎え入れよう 心を動かそう
Amebaらしさ3原則 らしさを体現するための約束事 21 Ameba Brand Guidelines 敬意を表そう 私たちがユーザーに何かを伝えたいとき、 自分たちの都合を押しつけていませんか? ユーザーが大事にしていることは一人ひとり異な
ります。その価値観を尊重し、寄り添うことが必要 です。一人ひとりの価値観を把握するためには、 あらゆる視点でユーザーを深く知ることが重要で す。 ユーザーの行動を観察・分析し、その背景に ある気持ちを理解してください。 ユーザーを理解し、その価値観を尊重する。敬意を 表しましょう。 心を動かそう 私たちがユーザーに反応を返すとき、 ただ事実だけを伝えていませんか? ユーザーは何かを求めてサービスに訪れます。た だ「使ってもらう」だけでなく、その時々でユー ザーがサービスに共感できるよう心がけてくださ い。Amebaを単なるシステムとして機能させず、 ひとりの人間としての情緒を持たせてください。扱 う言葉や表現に人間味や親しみを込めましょう。 私たちもまたユーザーに共感し、その感情に適し た言葉をかける。心を動かしましょう。 快く迎え入れよう 私たちがユーザーを迎えるとき、 ユーザーは自分の意思で行動・会話ができていますか? 様々な個性、多様な環境のユーザーがAmebaに訪れま す。壁を感じさせないよう快く受け入れ、困っていると きには手を差し伸べてください。友人に話しかけるよう な気軽さと、リズムの良いやりとりが理想です。ただし 極端に馴れ馴れしい話し方や、一方的な伝え方にならな いように心がけてください。 はじめての人にも常連の人にも、常に親しみやすく。快 く迎え入れましょう。
ビジョン、ミッション、コンセプト、ブランドアイデンティティの構造 22 Ameba Brand Guidelines ビジョン 理想とする姿の追求 ミッション 存在意義、社会的意志 ブランドコンセプト
らしさを体現するための実行原理 人と情報をつむぎ 暮らしが豊かに育ちつづける ための機会をつくる。 生きたコンテンツをつむぐ + ロゴ カラー タイポグラフィ アイコン イラスト 写真 キービジュアル Visual Identity ブランドバリュー Amebaが大事にしたい価値観 パーソナリティ ブランドが持つべき個性や印象 等身大でいられる 親しみやすい 多様性がある つながれる 誰にでも自然体で寄り添ってくれる存在 明るく、ほがらか 聞き上手 寛容である 印象がよい 顔が広い 親しい友人のような 流行に敏感で知識がある しっかりした一面もある Brand Identity Amebaらしさ3原則 敬意を表そう 心を動かそう 快く迎え入れよう
Visual Identity
ビジュアルアイデンティティとは ビジュアルアイデンティティ(VI)とは、ブランドアイデンティティを一貫したビジュアルの世界観で展開してい くことです。 VIによってブランドの強みやらしさ、世界観を社内外に正しくすばやく認知させ、効率的・効果的に浸透させるこ とができます。それらをデザインするための約束事が「Amebaらしさ3原則」になります。 24 Ameba Brand Guidelines Visual
Identity Ameba Principles Amebaらしさ3原則 書籍 広告/PR ウェブサイト グッズ アプリ サムネイル SNS スタッフブログ オフィス CM ABCDEFGHIJKLMNOPQRSTUVWXYZ
Brand Logo 25 Ameba Brand Guidelines
Brand Color らしさを表現するためのカラールール 26 Ameba Brand Guidelines Ameba green RGB
: R45 G140 B60 CMYK : C80 M30 Y100 K0 HEX : #2D8C3C PMS : 17- 6153TPX DIC : 2560 Black RGB : R0 G0 B0 CMYK : C0 M0 Y0 K100 HEX : #000000 PMS : Black3C DIC : 582 White RGB : R255 G255 B255 CMYK : C0 M0 Y0 K0 HEX : #FFFFFF PMS : - DIC : 583 Neutral Gray RGB : R246 G246 B246 CMYK : C4 M4 Y4 K0 HEX : #F6F6F6 PMS : DIC : 2560 Yellow Green RGB : R130 G190 B40 CMYK : C55 M0 Y100 K0 HEX : #82BE28 PMS : 15 - 0545TPX DIC : 2545 Yellow RGB : R245 G225 B0 CMYK : C10 M10 Y90 K0 HEX : #F5E100 PMS : DIC :
Expressive Color らしさの表現を拡張してデザインするためのカラールール 27 Ameba Brand Guidelines Expressive Blue RGB
: R106 G189 B226 CMYK : C58 M13 Y10 K0 HEX : #6ABDE2 Expressive Green RGB : R74 G195 B170 CMYK : C66 M0 Y44 K0 HEX : #4AC3AA Expressive Lavender RGB : R145 G122 B235 CMYK : C71 M68 Y0 K0 HEX : #917AEB Expressive Purple RGB : R202 G92 B230 CMYK : C44 M68 Y0 K0 HEX : #CA5CE6 Expressive Orange RGB : R230 G129 B92 CMYK : C11 M61 Y62 K0 HEX : #E6815C Expressive Yellow RGB : R230 G172 B92 CMYK : C14 M39 Y68 K0 HEX : #E6AC5C Expressive Pink RGB : R236 G99 B132 CMYK : C9 M74 Y29 K0 HEX : #EC6384
Brand Typography らしさをデザインするための書体 28 Ameba Brand Guidelines Ameba sans ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz 0123456789+-=!?/,.:;#$%&”’`*^ <>()[]{}@_|~ UD新丸ゴ ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789+-=!?/,.:;#$%&”’`*^ <>()[]{}@_|~ あいうえおかきくけこアイウエオカキクケコ AXIS ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789+-=!?/,.:;#$%&”’`*^ <>()[]{}@_|~ あいうえおかきくけこアイウエオカキクケコ Avenir ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789+-=!?/,.:;#$%&”’`*^ <>()[]{}@_|~ 欧文Font 和文Font
Iconography らしさをデザインするためのアイコン 29 Ameba Brand Guidelines
Illustration らしさを表現するためのイラスト、キャラクター 30 Ameba Brand Guidelines
Illustration Expressive らしさを表現するためのエクスプレッシブカラーを用いたイラスト 31 Ameba Brand Guidelines
UI 32 Ameba Brand Guidelines
Visual Use Case らしさを表現したビジュアル事例 33 Ameba Brand Guidelines AboutAmeba