Brand Guidelines — adiff.co

01

Brand Overview

Business Type

Tech News Web & App

เว็บและแอปพลิเคชันข่าวสั้นด้านเทคโนโลยี เน้นย่อยง่าย ทันเหตุการณ์ และเจาะลึก

Positioning

Short · Fast · Deep

พัฒนาต่อยอดจาก Blognone แต่กระชับ ย่อยง่าย เข้าถึงคนรุ่นใหม่ในโซเชียลมีเดีย

Core USP

⚡

ทันเหตุการณ์

Breaking news ก่อนใคร

🧠

เจาะลึก

วิเคราะห์ ไม่ใช่แค่รายงาน

💬

อ่านง่าย

ภาษาเพื่อน ไม่ใช่สำนักข่าว

🎯

ตรงประเด็น

ไม่มีคำฟุ่มเฟือย จบใน 3 นาที

02

Logo System

adiff.co

On light background

adiff.co

On dark background

Logo Anatomy

วงกลมนอก (Deep Core Blue) — เปลือกโลก สื่อถึงความน่าเชื่อถือและความเป็นมืออาชีพ

พื้นที่สีเหลือง (Magma Yellow) — ชั้นแมกมา สื่อถึงพลังงานและความฉับไว

ตัว D (White outline + Blue fill) — The Tech Core แกนกลางความรู้ที่เจาะทะลุออกมา

เส้นแนวตั้งซ้าย — สัญลักษณ์การ "เจาะทะลวง" จากภายนอกสู่แกนกลาง

Clear Space & Minimum Size

clear space = 1× logo width

Minimum digital24 × 24 px

Minimum print8 × 8 mm

Favicon16 / 32 / 64 px

Clear space1× เส้นผ่านศูนย์กลาง

Logo Don'ts

✕ห้ามบิดเบือน ยืด หรือบีบโลโก้

✕ห้ามเปลี่ยนสีที่ไม่ใช่ CI

✕ห้ามวางบน background ที่ตัดรุนแรง

✕ห้ามเพิ่ม shadow, outline หรือ effect

✕ห้ามใช้เล็กกว่า minimum size

✕ห้ามตัดหรือ crop ส่วนใดของโลโก้

03

Color Palette

Primary

Deep Core Blue

#1B435D

ความน่าเชื่อถือ · ความลึกซึ้ง · มืออาชีพ

Secondary

Magma Yellow

#FFAE34

พลังงาน · ฉับไว · แกนโลก · น่ารัก

Accent

Neon Mint

#4DEEEA

ล้ำสมัย · Tech-vibe · ความตื่นเต้น

Background

Soft Cream

#F9F9F6

สบายตา · อ่านง่าย · ลดความกระด้าง

Color Combinations

Primary + Yellow

Hero · Navbar · CTA

Yellow + Blue

Button · Badge · Tag

Cream + Blue

Content · Body · Card

Primary + Mint

Accent · Tech badge

Extended UI Palette

Blue Light

#E8F0F5

Yellow Light

#FFF5E0

Mint Light

#E0FDFB

Ink Dark

#2C2C2A

Gray Mid

#6B6B68

Border

#EBEBE6

04

Typography

Primary Typeface

Aa

DM Sans

Primary · UI · Web

Light 300 Regular 400 Medium 500 SemiBold 600 Bold 700

Type Scale

Hero — 32px / 700

Landing page · Social OG · App store

Headline — 24px / 700

News title · Article header

Section title — 18px / 600

Card title · Section heading

Body text — 15px / 400 · line-height 1.7 — ใช้สำหรับเนื้อหาข่าว สรุปบทความ และคำอธิบายทั่วไป

Article body · Summary

Caption / Label — 12px / 500

Tag · Timestamp · Category badge

1.2

Headline line-height

1.7

Body line-height

−0.3px

Headline tracking

05

Components

Buttons

Border-radius: 10px · Font-weight: 700 สำหรับ filled, 600 สำหรับ outlined

Badges & Tags

Breaking AI Startup Hardware 2 นาทีที่แล้ว 5 นาทีอ่าน New

Border Radius System

0px
Sharp

6px
Icon

10px
Button

14px
Card

20px
Panel

50%
Avatar

สไตล์กราฟิกเน้น Rounded Corners สื่อถึงความรู้สึกพรีเมียมแต่เข้าถึงง่าย ไม่แข็งทื่อ

News Card Component

⚡ Breaking AI

OpenAI เปิดตัว o3-pro พร้อมฟีเจอร์ใหม่ที่ทำให้โลกเปลี่ยน

สรุปสั้น: ฉลาดขึ้น เร็วขึ้น แต่ราคาก็สูงขึ้นตามด้วย มาดูกันว่าคุ้มสำหรับสายเทคไหม

2 นาทีที่แล้ว · 4 นาทีอ่าน

06

Motion & Animation

Animation Principles

200ms

Micro interaction

Hover · Focus · Button press

350ms

Transition

Panel open · Drawer · Modal

ease-out

Easing default

Fast start, soft landing

fade+up

Card entrance

translateY(8px) → 0 + opacity

Guiding Principle

สไตล์ animation ของ adiff.co ควรรู้สึก เร็ว ฉับไว แต่ไม่กระตุก เหมือน brand persona ที่เป็นเพื่อนสนิทสายเทค ไม่ช้าเชื่องช้าจนดูเป็นองค์กรใหญ่

07

Brand Persona & Tone

The Tech Bestie — เพื่อนสนิทสายเทค

ฉลาด รอบรู้ ช่างสังเกต ขี้เล่น แต่พึ่งพาได้เวลามีข่าวด่วน ไม่ใช้ภาษาสำนักข่าวที่เข้าถึงยาก แต่ย่อยเรื่องยากให้กลายเป็นเรื่องสนุกสนาน

ย่อยง่าย รู้ลึก ทะลุแกนโลก สั้นแต่ครบ ทันเหตุการณ์ Tech-vibe Charming

Tone Comparison

✕ ห้ามใช้ — ทางการเกินไป

"บริษัท OpenAI ได้เปิดเผยในวันนี้ว่าโมเดลปัญญาประดิษฐ์รุ่นล่าสุด ซึ่งมีชื่อว่า o3-pro นั้นมีความสามารถที่เหนือกว่าโมเดลก่อนหน้า..."

✓ สไตล์ adiff.co

"OpenAI เพิ่งปล่อย o3-pro ออกมา และมันฉลาดขึ้นอีกแล้ว แต่ก็แพงขึ้นตามด้วยนะ 👀 มาดูกันว่าคุ้มสำหรับสายเทคไหม"

Slogans & Taglines

Main Slogan

"เจาะลึกเรื่องเทค แบบจบในแวบเดียว"

Alt 1: "สั้น เร็ว ลึก — ครบในแวบเดียว"

Alt 2: "ข่าวเทคที่เพื่อนบอก ไม่ใช่สำนักข่าวรายงาน"

Alt 3: "Tech News — Short, Fast, Deep"

Writing Vocabulary

✓ คำที่ใช้ได้

เจ๋ง ล้ำ เอาจริง มาดูกัน น่าสนใจมาก เพิ่งรู้เลย แบบนี้เลย รู้ยัง?

✕ คำที่ห้ามใช้

ทางบริษัทฯ ได้เปิดเผย กล่าวอ้างว่า ในปัจจุบัน อย่างไรก็ตาม สืบเนื่องจาก

08

Content Formula

1

The Hook — เปิดเปลือกโลก

ตั้งคำถามหรือเปิดประเด็นกระตุ้นความอยากรู้ ให้คนเห็นในฟีดแล้ว "เอ๊ะ?" ทันที ใช้ question, contradiction หรือ surprising fact

"ถ้า AI เขียนโค้ดแทนได้ทั้งหมด... นักพัฒนาจะยังมีงานทำไหม? 🤔"

2

The Meat — เนื้อโลก

สรุปใจความสำคัญใน 2–3 บรรทัด สั้น กระชับ ไม่ใช้ศัพท์เทคนิคเกินพิกัด ใช้คำน่ารักเข้าใจง่าย

"GitHub Copilot ออกฟีเจอร์ใหม่ที่ทำให้เขียนโค้ดได้เร็วขึ้น 55% ด้วย AI Agent Mode ที่คิดแทนได้เลยแบบ step-by-step"

3

The Core — เจาะถึงแกน

ทิ้งท้ายชวนไปอ่านต่อในแอป/เว็บ ด้วยคำพูดเชิญชวนน่าเอ็นดู อยากกด อยากอ่านต่อ

"มาเจาะลึกกันต่อที่ adiff.co ✨ ไม่เกิน 3 นาทีก็รู้เรื่องครบ!"

09

Social Media Specs

Platform Guidelines

Social Post Rules

🔖ทุก post ต้องมีโลโก้ adiff.co watermark มุมล่างขวา

📐ใช้ safe zone 5% รอบขอบภาพเสมอ

🔤ฟอนต์ขั้นต่ำ 20px บนภาพ อ่านออกบนมือถือ

🎨ใช้สีจาก CI palette เท่านั้น ไม่ใช้สีนอกระบบ