# คู่มือแบรนด์ โพดทอด (POD TOD) ฉบับ 2.0

## แนวคิด

โพดทอดฉบับใหม่ใช้ตัวอักษรไทยตัวใหญ่ที่ชิดกันแน่น วางบนพื้นเหลืองเต็มหน้า แบบป้ายร้านคาเฟ่และร้านขนมในโซลหรือโตเกียว
เลย์เอาต์เรียบ สีน้อย ตัวหนังสือคม แล้วให้อาหารเป็นจุดเดียวที่มีรายละเอียด ทั้งผิวกรอบสีทอง ซอสเงาที่ไหลย้อย และเศษแป้งทอด
สีเข้มของแบรนด์คือ **น้ำตาลคั่ว** ไม่ใช่สีดำ จึงอ่านเป็นสีของอาหาร (คาราเมล กาแฟ ขอบทอด) ไม่อ่านเป็นป้ายเตือน
โลโก้คือคำว่า "โพด / ทอด." ซ้อนสองบรรทัด กับสัญลักษณ์ข้าวโพดที่ทำจากเมล็ดวงกลม 12 จุดและเปลือกสองซีก (ในไอคอนลดเหลือ 9 จุดเพื่อให้ชัดที่ขนาดเล็ก)

## ไฟล์

| ไฟล์ | ใช้ทำอะไร |
|---|---|
| `logo-primary.svg` | โลโก้หลัก สีน้ำตาลคั่ว พื้นโปร่งใส ใช้บนเหลือง ครีม หรือขาว |
| `logo-on-dark.svg` | โลโก้สีเหลืองกับครีม สำหรับพื้นน้ำตาลคั่วหรือภาพถ่ายที่มืด |
| `logo-mono.svg` | สีดำสีเดียว สำหรับตรายาง สกรีน และเลเซอร์ (เปลี่ยนเป็นสีอื่นสีเดียวได้) |
| `logo-icon.svg` | ไอคอนสี่เหลี่ยมจัตุรัสมุมมน สำหรับโปรไฟล์โซเชียล favicon และแอป ยังอ่านออกที่ 16 px |
| `food/NN-*.svg` | ภาพของทอด 5 ชนิด แบบไม่ราดซอส (มีรอยกัดให้เห็นไส้) และแบบ `-sauce` ราดซอส พื้นโปร่งใส |
| `sauces/S1–S8-*.svg` | สัญลักษณ์ซอสรูปหยดซอสไหล ใช้ทำปุ่มเลือกซอส ป้ายเมนู และสติกเกอร์ฝาถ้วย |
| `icons/NN-*.svg` | ไอคอนเมนูสีเดียว สร้างจากวงกลมกับแคปซูล ใช้คู่กับเลขเมนู |
| `pattern.svg` | ลายจุดเมล็ดข้าวโพด 1200×1200 ต่อกันได้ สำหรับถุง กล่อง และกระดาษห่อ |
| `key-visual.svg/.png` | ตัวอย่างโปสเตอร์ 1080×1350 สำหรับ IG ใช้เป็นต้นแบบการจัดหน้า |
| `tokens.json` / `tokens.css` | ค่าสี ฟอนต์ ขนาดตัวอักษร ระยะห่าง และมุมโค้ง สำหรับทีมเว็บ แพ็กเกจ และคีออสก์ |
| `brand-sheet.png` | แผ่นสรุปแบรนด์ภาพเดียว |
| `preview/` | ภาพ PNG ของ SVG ทุกไฟล์ ไว้ดูเท่านั้น งานจริงให้ใช้ SVG |
| `_src/` | สคริปต์ Python ที่สร้างทุกไฟล์ (`bash _src/build_all.sh`) |

ตัวอักษรในไฟล์ SVG ทุกไฟล์แปลงเป็นเส้นแล้ว ร้านพิมพ์ไม่ต้องติดตั้งฟอนต์

## สี

| ชื่อ | HEX | CMYK (ประมาณ) | สัดส่วน |
|---|---|---|---|
| เหลืองโพด Pod Yellow | `#FFC31F` | C0 M24 Y92 K0 | 60–70% พื้นหลัก |
| น้ำตาลคั่ว Roast | `#2B1A10` | C45 M70 Y85 K80 | 15–20% ตัวอักษร โลโก้ แถบล่าง |
| ครีมกะทิ Coconut Cream | `#FFF5E1` | C0 M3 Y12 K0 | 10% พื้นรอง การ์ด |
| ส้มกรอบ Golden Crust | `#E07B1F` | C5 M60 Y95 K0 | รวมกับเหลืองเนยราว 5% ใช้กับป้ายราคาและไฮไลต์ |
| เหลืองเนย Butter | `#FFE38A` | C0 M9 Y55 K0 | พื้นซ้อนบนเหลือง |
| แดงพริก Chili | `#E2432A` | C0 M85 Y85 K0 | ไม่เกิน 3% เฉพาะป้าย "ใหม่" หรือ "เผ็ด" |

สีซอส 8 สี (S1–S8) ใช้เฉพาะกับเรื่องซอสเท่านั้น ห้ามนำไปเป็นสีพื้นหรือสีตัวอักษรของแบรนด์ ค่าสีอยู่ใน `tokens.json`
ค่า CMYK เป็นค่าประมาณ ต้องปรู๊ฟก่อนสั่งพิมพ์จำนวนมาก โดยเฉพาะเหลืองบนกระดาษคราฟต์ซึ่งจะออกหม่น ให้พิมพ์ขาวรองก่อน

## ตัวอักษร (Google Fonts ใช้เชิงพาณิชย์ได้ด้วยสัญญาอนุญาต OFL)

- **Prompt Black 900 / ExtraBold 800**: หัวข้อภาษาไทย ชื่อเมนู ราคา และโลโก้ เป็นตัวไม่มีหัว ทรงเรขาคณิต ตั้งตัวใหญ่ ระยะบรรทัด 0.86 ชิดตัวอักษร -1%
  ทดลองเทียบกับ Kanit Black, Anuphan Bold, Noto Sans Thai Black และ IBM Plex Sans Thai Bold แล้ว Prompt Black ตัวหนาแน่นและคมที่สุดเมื่อตั้งตัวใหญ่ ส่วนสระและวรรณยุกต์ที่ทดสอบด้วย HarfBuzz วางตำแหน่งถูกต้อง
- **Inter Tight ExtraBold 800**: ภาษาอังกฤษ ตั้งเป็นตัวพิมพ์ใหญ่ล้วน เว้นตัวอักษร +8 ถึง +14% เช่น FRIED & SAUCED
- **IBM Plex Sans Thai 400–600**: เนื้อความ คำอธิบาย และปุ่ม
- **IBM Plex Mono 600**: เลขเมนู รหัสซอส และราคาตัวเล็ก **ฟอนต์นี้ไม่มีตัวไทย** ถ้าพิมพ์ไทยด้วยฟอนต์นี้จะขึ้นเป็นกล่องสี่เหลี่ยม

## โลโก้

- ใช้ไฟล์ตามที่ให้ไว้ ย่อหรือขยายต้องล็อกสัดส่วน ห้ามยืด ห้ามเอียง ห้ามใส่เส้นขอบ เงา หรือเอฟเฟกต์ใด ๆ
- เว้นพื้นที่ว่างรอบโลโก้อย่างน้อยเท่าความสูงของตัว "อ"
- ความกว้างขั้นต่ำของโลโก้เต็ม: 30 มม. ในงานพิมพ์ หรือ 240 px บนจอ ถ้าเล็กกว่านี้ให้ใช้ `logo-icon.svg`
- ใช้คำว่า "โพด/ทอด." แยกเดี่ยว ๆ (ไม่มีสัญลักษณ์ข้าวโพด) เป็นตัวอักษรใหญ่บนโปสเตอร์ได้ ต้องคงจุด "." ไว้ทุกครั้ง เพราะเป็นส่วนหนึ่งของชื่อ

## ภาพอาหาร: ส่วนที่ทำให้น่ากิน

- อาหารต้องเป็นภาพที่มีรายละเอียดที่สุดในหน้า ส่วนอื่น (ตัวอักษร พื้น เส้นแบ่ง) ให้แบนและเรียบ
- สูตรของภาพ: มองเฉียงจากด้านบนเล็กน้อย มีความหนาด้านข้างสีน้ำตาลทอด ผิวด้านบนไล่สีทองจากเหลืองนวลถึงส้มไหม้ มีเกล็ดแป้งกรอบ จุดไหม้เล็ก ๆ และเงานุ่มด้านล่าง **ไม่มีเส้นขอบ**
- ซอสต้องเงาเสมอ มีแสงสะท้อนสีขาวหนึ่งเส้นด้านซ้ายบน และหยดซอสไหลลงข้างชิ้นอย่างน้อยหนึ่งหยด
- แบบไม่ราดซอสโชว์เนื้อข้างใน: มันและฟักทองมีรอยกัดเห็นเนื้อสีส้ม กล้วยแขกเห็นเนื้อสีครีม เผือกเป็นกองเส้นที่แป้งกะเทาะเห็นเนื้อม่วงอ่อน
- วางอาหารบนพื้นเหลืองหรือพื้นครีม หรือวางคร่อมรอยต่อระหว่างพื้นเหลืองกับแถบน้ำตาลคั่ว (ดู key-visual) อาหารสีทองบนพื้นน้ำตาลเข้มดูน่ากินที่สุด
- ขนาดอาหารบนโปสเตอร์ควรกว้างราว 50–70% ของหน้า ไม่ใช้เป็นไอคอนจิ๋ว ถ้าต้องการภาพเล็กให้ใช้ `icons/` แทน
- ถ้าจะถ่ายภาพจริงในอนาคต: แสงอุ่นเข้าจากด้านซ้ายบน พื้นเหลืองหรือครีมเรียบ ๆ ซอสต้องเงาและเห็นหยดซอสไหล ห้ามใช้ฟิลเตอร์สีเย็น

## วิธีไม่ให้ดูเหมือนเทปกั้นเขตหรือร้านวัสดุก่อสร้าง

1. ห้ามใช้ดำล้วน `#000` คู่กับเหลือง ให้ใช้น้ำตาลคั่ว `#2B1A10` เสมอ (ยกเว้นไฟล์ mono สำหรับตรายาง)
2. ห้ามใช้ลายทางเฉียง ลายหมากรุก หรือแถบเหลืองดำสลับกัน
3. ทุกชิ้นงานที่มีพื้นที่พอต้องมีอาหารหรือซอสอย่างน้อยหนึ่งจุด เพราะของกินทำให้เหลืองอ่านเป็นข้าวโพดและเนย
4. ใช้ครีมกะทิเป็นสีที่สาม เพื่อให้พื้นนุ่มขึ้น เช่น การ์ดเมนูและพื้นเว็บส่วนเนื้อหา
5. มุมโค้งและวงกลม (จุด เมล็ด หยดซอส) ทำให้แบรนด์ดูนุ่ม ห้ามใช้สามเหลี่ยมเตือนหรือมุมแหลม

## ห้ามทำ

- ห้ามใส่เส้นขอบหนา เงาแข็งแบบเลื่อนออกไป ดาวระเบิด หรือตัวอักษรเด้ง (นี่คือลุคเก่าที่เลิกใช้แล้ว)
- ห้ามใช้มาสคอตหน้าการ์ตูน สัญลักษณ์ข้าวโพดเม็ดกลมคือตัวแทนของแบรนด์แทน
- ห้ามใช้ฟอนต์อื่นนอกจากสี่ตัวที่กำหนด
- ห้ามวางตัวอักษรทับตัวอาหาร ยกเว้นป้ายราคาที่มีพื้นรองเป็นของตัวเอง
- ห้ามใช้สีซอสเป็นสีพื้นหลักของหน้า

## กริดและการจัดหน้า

**หลักทั่วไป**
- ระยะขอบหน้า = 1/15 ของด้านที่สั้นกว่า (โปสเตอร์ 1080 px ใช้ 72 px)
- ลำดับจากบนลงล่าง: บรรทัดเล็กบอกชื่อร้าน (Inter Tight ตัวใหญ่ล้วน) ตามด้วยเส้นแบ่ง 2–3 px ตามด้วยคำใหญ่ (Prompt Black) ตามด้วยอาหาร แล้วจบด้วยแถบข้อมูล (ราคาและเลขเมนู)
- คำใหญ่ชิดซ้าย ข้อความเล็กชิดซ้ายหรือขวาตามขอบ ห้ามจัดกึ่งกลางทั้งหน้า
- เส้นแบ่งใช้สีเดียวกับตัวอักษร หนา 2 px ที่ 1x และใช้เป็นจังหวะของหน้าแบบเมนูร้านญี่ปุ่น

**บรรจุภัณฑ์ (ถ้วย ถุง กล่อง)**
- กริด 6 คอลัมน์ พื้นเหลืองเต็ม หรือพิมพ์ `pattern.svg` เต็มพื้นที่
- ด้านหน้าวาง "โพด/ทอด." ใหญ่ให้กว้าง 60–70% ของหน้า และวางสัญลักษณ์ข้าวโพดที่มุมขวาล่าง
- ด้านข้างหรือด้านหลังใช้แถบน้ำตาลคั่วสูง 25–35% ใส่รายการ "01 CORN 02 TARO ..." ด้วย IBM Plex Mono สีครีม
- สติกเกอร์ฝาถ้วยใช้สัญลักษณ์ซอส S1–S8 ตามซอสที่ลูกค้าเลือก พร้อมเลข S และชื่อซอสไทย
- ถุงคราฟต์สีเดียว: ใช้ `logo-mono.svg` สีน้ำตาลคั่ว

**ป้ายร้าน เมนูบอร์ด และคีออสก์**
- ป้ายหน้าร้าน: พื้นเหลือง ใช้โลโก้หลักชิดซ้าย อาหารไม่ต้องใส่ เพราะป้ายต้องอ่านได้จากไกล
- เมนูบอร์ด: แต่ละแถวเรียงเป็นเลข (Mono) ไอคอน ชื่อไทย (Prompt Black) ชื่ออังกฤษ (Inter Tight) แล้วตามด้วยราคา แถวที่แนะนำใช้พื้นเหลือง แถวอื่นใช้พื้นครีมหรือขาว
- ขั้นตอนเลือกถ้วยมิกซ์ "3 ทอด + 1 ซอส + 1 ท็อปปิ้ง": ใช้ภาพจาก `food/` สำหรับของทอด และใช้หยดซอสจาก `sauces/` เป็นปุ่มเลือกซอส
- ความสูงตัวอักษรบนป้าย: ชื่อเมนูอย่างน้อย 25 มม. ต่อระยะอ่าน 5 เมตร

## เลขเมนู

ของทอด: 01 CORN ข้าวโพดทอด · 02 TARO เผือกทอด · 03 SWEET POTATO มันทอด · 04 PUMPKIN ฟักทองทอด · 05 BANANA กล้วยแขก
เมนูที่จะมา: 06 PURPLE YAM · 07 CHEESE TARO · 08 KHAO MAO · 09 JP SWEET POTATO · 10 MOCHI (ไอคอนให้สร้างจากวงกลมและแคปซูลแบบเดียวกัน)
ซอส: S1 กะทิข้าวโพดย่าง · S2 ชีสเยิ้ม · S3 ชาไทย · S4 สังขยาใบเตย · S5 คาราเมลเกลือ · S6 เผ็ดเกาหลีน้ำผึ้ง · S7 ช็อกโกแลตมอลต์ · S8 นมสดมันม่วง

ราคา "79.-" ในตัวอย่างโปสเตอร์เป็นตัวเลขสมมติ ต้องเปลี่ยนเป็นราคาจริงก่อนนำไปใช้