Apple (España)
วิหารแห่งความว่างเปล่าสีขาวโพลนที่มีพาดหัวข่าวเบาจนแทบไม่ได้ยิน ห้องโถงขนาดใหญ่สว่างไสวที่ซึ่งตัวอักษรขนาดมหึมาความหนาแน่น 700 ลอยอยู่ในอากาศ ยึดติดกันด้วยสีพาสเทลและเส้นด้ายสีน้ำเงินเพียงเส้นเดียว
ภาษาที่ใช้ในหน้าผลิตภัณฑ์ของ Apple คือตัวอย่างของการใช้ตัวอักษรที่เอื้อเฟื้อเผื่อแผ่: หัวข้อขนาดใหญ่บนจอแสดงผล SF Pro วางอยู่บนพื้นหลังสีขาวนวล ล้อมรอบด้วยพื้นที่ว่างสีขาวมากมายที่ทำให้ทุกคำดูตั้งใจจัดวาง โทนสีเกือบจะเป็นสีเดียว—ข้อความสี #1d1d1f พื้นหลังสลับระหว่าง #ffffff และ #f5f5f7—โดยมีสีน้ำเงินเพียงสีเดียว (#0071e3) ที่สงวนไว้สำหรับช่วงเวลาโต้ตอบเท่านั้น สีสันปรากฏอยู่ในภาพผลิตภัณฑ์เอง (โทนสีพาสเทล) ไม่ใช่ในฐานะองค์ประกอบตกแต่ง UI ส่วนประกอบต่างๆ ไม่มีกรอบ: การ์ดทรงโค้งมนรัศมี 28 พิกเซล ปุ่มรูปทรงแคปซูลเกือบจะชิดขอบหน้ากระดาษ โดยไม่มีกรอบหรือเงาตกกระทบที่มองเห็นได้ จังหวะถูกสร้างขึ้นโดยแถบสีขาวและสีเทาสลับกัน ไม่ใช่ตัวแบ่งหรือเส้นขอบ
ส่วนต่างๆ จะครอบคลุมความกว้างเต็มหน้ากระดาษ ขยายจากขอบถึงขอบโดยมีระยะห่างที่เหมาะสม (ประมาณ 40-100 ด้าน) ความกว้างของเนื้อหาจะอยู่ตรงกลางของแต่ละแถบอย่างมีประสิทธิภาพ องค์ประกอบหลักคือการจัดเรียงแบบกึ่งกลาง: ป้ายกำกับรูปทรงคล้ายคิ้ว หัวข้อขนาดใหญ่ ปุ่มกระตุ้นการดำเนินการเพียงปุ่มเดียว แถวราคา และภาพผลิตภัณฑ์ที่อยู่ด้านล่างของหน้าจอ ส่วนต่างๆ จะมีรูปแบบที่ซ้ำกัน: หัวข้อจัดชิดซ้ายภายในแถบ ตามด้วยเค้าโครงสองคอลัมน์พร้อมคำอธิบายผลิตภัณฑ์ (ข้อความด้านซ้าย/ภาพด้านขวา หรือสลับกัน) ตารางการ์ดสามคอลัมน์ หรือการแสดงภาพแบบกึ่งกลาง จังหวะของเนื้อหาถูกควบคุมโดยพื้นหลังสีขาวและสามสีสลับกัน โดยมีช่องว่างแนวตั้ง 100-100 ซม. โดยไม่มีตัวแบ่งหรือการ์ดที่มีองค์ประกอบใดๆ การนำทางโดยรวมเป็นแถบเดียวคงที่ ส่วนข้อมูลจำเพาะของผลิตภัณฑ์จะใช้แถบความกว้างเต็มพื้นที่พร้อมระยะห่างที่เหมาะสม โดยจัดวางข้อความไว้ตรงกลางในคอลัมน์แคบๆ (~560 พิกเซล) บนพื้นที่แสดงผลที่กว้างกว่า
ภาษาภาพของ Apple นั้นเน้นที่การถ่ายภาพผลิตภัณฑ์เป็นหลัก: ภาพระยะใกล้ของฮาร์ดแวร์โดยใช้พื้นหลังสีขาวหรือสีบริสุทธิ์ โดยไม่มีบริบทของไลฟ์สไตล์หรือฉากที่จัดฉากไว้ ภาพหลักแสดงมือที่กำลังถือ MacBook Neo สีเขียวพาสเทล องค์ประกอบของมนุษย์เป็นรองลงมา โดยแสดงขนาดและพื้นผิวมากกว่าอารมณ์ ในส่วนของผลิตภัณฑ์รุ่นต่างๆ จะมีการนำเสนออุปกรณ์สองชิ้นเคียงข้างกันโดยใช้พื้นหลังสีที่เข้ากัน (ชมพู เขียว เงิน ฟ้าอ่อน) แต่ละการ์ดเป็นพื้นสีเรียบโดยมีผลิตภัณฑ์อยู่ตรงกลาง ภาพรายละเอียดใช้ภาพระยะใกล้มาก (บานพับแล็ปท็อป โมดูลกล้อง) โดยใช้พื้นหลังที่เป็นกลาง ไม่มีภาพประกอบ ไม่มีกราฟิกนามธรรม ไม่มีภาพตกแต่ง ผลิตภัณฑ์เองคือองค์ประกอบภาพ ไอคอนต่างๆ ปรากฏอยู่ทุกที่—ไอคอนเส้นขาวดำในสไตล์ SF Symbols หนา 1.5–2 พิกเซล ซึ่งนำมาจากชุดไอคอนระบบของ Apple การถ่ายภาพมักทำในลักษณะไฮคีย์: แสงสม่ำเสมอ ปราศจากเงา ซึ่งลดทอนผลิตภัณฑ์ให้เหลือเพียงรูปแบบกราฟิกมากกว่าวัตถุสามมิติ
จานสี
ยี่ห้อ
- Electric Blue
#0071e3— ปุ่มแอ็กชันที่เติมสีเป็นสีเน้นเพียงสีเดียวใน UI โดยใช้เพียงเล็กน้อยสำหรับคำสั่งกระตุ้นการกระทำ - Link Blue
#0066cc— ลิงก์ข้อความแบบแทรกในเนื้อหา ลิงก์ที่มีลูกศรและเครื่องหมายลูกศรชี้ - Citrus Gradient
#3b3b23— อีกหนึ่งเอกลักษณ์ที่โดดเด่นของผลิตภัณฑ์นี้คือ พื้นผิวสีเข้มที่ค่อยๆ ไล่เฉดสีไปเป็นสีเหลืองอมเขียว
เป็นกลาง
- Primary Ink
#1d1d1f— หัวข้อ ข้อความหลัก และป้ายกำกับปุ่มใช้โทนสีพื้นหน้าหลักบนทุกพื้นผิว โดยพื้นหลังของภาพผลิตภัณฑ์หลักจะเปลี่ยนจากสีทึบ #1d1d1f ที่ด้านบนไปเป็นสีน้ำเงินแบบมีมิติอย่างราบรื่น - Mid Gray
#707070— ข้อความรอง, สถานะการนำทางที่ไม่ทำงาน, ป้ายกำกับ UI ที่ปิดเสียง - Deep Gray
#474747— ข้อความนำทางและไอคอนต่างๆ ใช้แบบอักษรขนาดกลาง - Hairline
#d6d6d6— เส้นแบ่งระหว่างส่วนต่างๆ และองค์ประกอบ UI นั้นบางมาก - Canvas
#f5f5f7— พื้นหลังส่วนต่างๆ สลับกัน - แถบสีเทาคั่นระหว่างพื้นที่สีขาว - Paper
#ffffff— พื้นผิวการ์ด, พื้นหลังหน้าหลัก, ข้อความบนปุ่มบนพื้นหลังสีเข้ม
การจัดพิมพ์
จาก 12 เป็น 96 พิกเซล · 10 ขั้นตอน
- SF Pro Display — ทดแทน: Inter · โครงร่าง 600, 700 · หัวข้อหลักและหัวข้อย่อยสำหรับการแสดงผล — น้ำหนักตัวอักษร 700 ที่ระยะห่าง 80–96 พิกเซล พร้อมระยะห่างระหว่างตัวอักษรติดลบ -1.44 พิกเซล จะสร้าง "หัวข้อขนาดใหญ่ลอยอยู่บนพื้นหลังสีขาว" อันเป็นเอกลักษณ์ของ Apple ตัวเลือกอื่น: Inter, system-ui
- SF Pro Display — ทดแทน: Inter · โครงร่าง 600 · หัวข้อส่วน ชื่อการ์ด หัวข้อย่อย - แบบอักษรขนาด 600 ที่เว้นระยะห่างระหว่างตัวอักษรเล็กน้อย ให้ความรู้สึกอบอุ่นและเป็นมิตรในขนาดกลาง ซึ่งแตกต่างจากหัวข้อสั้นๆ ด้านบน
- SF Pro Text — ทดแทน: Inter · โครงร่าง 400, 500, 600 · สำหรับเนื้อหาหลัก ข้อความนำทาง ย่อหน้าสนับสนุน และคำบรรยายภาพขนาดเล็ก จะใช้ฟอนต์ที่มีค่าดัชนี 400 ที่ขนาด 17 พิกเซลเป็นหลัก การเว้นระยะห่างระหว่างตัวอักษรแบบติดลบจะช่วยให้ข้อความหลักกระชับยิ่งขึ้นในหน้าเว็บที่มีข้อมูลจำนวนมาก
ช่วงเวลาและรูปแบบ
| วัตถุประสงค์ | ความหมาย |
|---|---|
| ความหนาแน่น | หนาแน่น |
| ขั้นตอนพื้นฐาน | 8-10px |
| รัศมีปุ่ม | 980px |
| รัศมีการ์ด | 28px |
| เงา | ไม่ - ใช้เส้นขอบแทนเงา |
| ระหว่างส่วนต่างๆ | 100-120px |
| ความกว้างของหน้า | 1200px |
AI จะสร้างเว็บไซต์ของคุณในสไตล์ของ Apple (España) และเติมข้อมูลลงไป
- ใส่สินค้าและโพสต์ผ่านลิงก์ - Instagram, TikTok, Facebook
- ย้ายเนื้อหาจากเว็บไซต์เก่าของคุณ—เพียงระบุที่อยู่เว็บไซต์
- ดีไซน์ทันสมัยบนเอนจิ้นที่ดีที่สุด: React ( Next.js) พร้อมการเรนเดอร์ฝั่งเซิร์ฟเวอร์และการเพิ่มประสิทธิภาพ SEO ในตัว
- การเพิ่มประสิทธิภาพ SEO แบบอัตโนมัติเต็มรูปแบบสำหรับผลการค้นหาและคำแนะนำจากโครงข่ายประสาทเทียม
สไตล์ที่คล้ายกัน
- Airbnb — ผนังแกลเลอรี่สีขาวเงียบสงบ มีเพียงที่คั่นหนังสือสีแดงปะการังชิ้นเดียว
- Peak Design — ผนังแกลเลอรี่ที่ได้รับแสงสว่างเพียงบางส่วน
- Ramp — แผนกการเงินของกองบรรณาธิการ หน้ากระดาษขาวดำที่มีเครื่องหมายนีออนเพียงอันเดียว พื้นผิวของสิ่งพิมพ์แทบจะเป็นสีเดียว โดยมีเพียงเส้นสีเขียวมะนาวสดใสเส้นเดียวที่เปลี่ยนทุกปฏิสัมพันธ์ให้กลายเป็นสัญญาณทางการเงิน
- 099 SUPPLY — ผนังแกลเลอรี่ที่เต็มไปด้วยวัตถุสีดำและสีขาว
- Orderful — สมุดตรวจสอบรายการควบคุมโลจิสติกส์อุตสาหกรรม - สมุดตรวจสอบรายการควบคุมการจัดส่งสินค้าที่พิมพ์ด้วยหมึกสีดำและสีแดงเข้ม แต่ละหน้ามีความเรียบง่ายพอที่จะให้ผู้ปฏิบัติงานคนใดคนหนึ่งตะโกนบอกข้อมูลสำคัญได้
- Apple (España) — ตู้โชว์สีขาว
- teenage engineering — แคตตาล็อกสินค้าอุตสาหกรรมด้านไฟสตูดิโอ - ตัวผลิตภัณฑ์เป็นสิ่งเดียวที่มีความสำคัญบนหน้าเว็บ ส่วนสิ่งอื่นๆ นั้นถูกกล่าวถึงโดยรอบ
- Apple (España) — หน้าต่างแกลเลอรี่ในหมอกยามเช้า
- Lightship — ภาพจำลองเส้นทางบนท้องถนนที่งดงามราวกับภาพยนตร์ ผนังแกลเลอรี่สีครีมอบอุ่นประดับด้วยภาพถ่ายทิวทัศน์ขนาดใหญ่ที่ติดตั้งในระยะห่างพอประมาณ ตัวอักษรสีดำบางๆ แทบมองไม่เห็นบนกรอบภาพ และมีสีส้มสดใสเพียงสีเดียวที่ตัดกับสีขาวดำราวกับกองไฟในทุ่งหญ้า
- Custo — แกลเลอรี่สีเทาเข้มพร้อมตัวอักษรแบบโมโนลิธ โชว์รูมโทนสีเทาอมเขียวที่ดูเรียบง่าย ซึ่งมีเพียงวัตถุสีเข้มชิ้นเดียวและตัวอักษรขนาด 57 พิกเซลที่สื่อความหมายได้ด้วยตัวเอง
- Silencio — ห้องสีขาวที่มีสิ่งของจัดแสดงลอยอยู่ การจัดแสดงในแกลเลอรี่ที่ทำจากกระดาษสีโทนอบอุ่น โดยแต่ละองค์ประกอบวางอยู่บนพื้นหลังที่ว่างเปล่า และความเงียบสงบนั้นเป็นเจตนาในการออกแบบ
- ORYZO AI — ภาพถ่ายชุดเกี่ยวกับห้องมืด วัตถุโดดเดี่ยวที่ลอยอยู่ท่ามกลางความมืดอบอุ่น ตัวอักษรสีครีมเป็นสิ่งประดับเพียงอย่างเดียว