Tags:

ฟีเจอร์สำคัญอย่างหนึ่งของ Android 4.0 Ice Cream Sandwich คือฟอนต์ตัวใหม่ Roboto ที่ออกแบบขึ้นมาใหม่หมดเพื่อใช้แทนฟอนต์ตระกูล Droid (ทั้ง Droid Sans/Serif) ที่ใช้มาตั้งแต่แรก

Matias Duarte หัวหน้าทีมออกแบบของ Android (เขาเคยอยู่กับ Palm มาก่อน) ออกมาอธิบายเบื้องหลังการสร้างฟอนต์ Roboto ผ่าน Google+ ของเขาดังนี้

Matias อธิบายว่าฟอนต์ Droid ถูกออกแบบมาเพื่อใช้กับจอภาพที่ไม่ละเอียดอย่างในปัจจุบัน จึงไม่มีการทำ anti-alias เพื่อให้ฟอนต์ดูคมขึ้น ตัวอักษรจึงดูเป็นบล็อค และฟอนต์ตัวหนาจะมีความกว้างกว่าฟอนต์ตัวธรรมดา (เกิดจากข้อจำกัดเรื่องการออกแบบฟอนต์โดยใช้พิกเซลจำนวนน้อยๆ) ผลคือเวลาเปลี่ยนจากตัวธรรมดา <=> ตัวหนาจะเกิดอาการ "ข้อความเลื่อน" ให้เห็น

เมื่อมาถึงยุคสมัยของ Ice Cream Sandwich หน้าจอมือถือมีความละเอียดเพิ่มขึ้นมาก (Galaxy Nexus ละเอียด 720p) ทำให้กูเกิลต้องหาฟอนต์ใหม่ โดยมีข้อกำหนดว่าฟอนต์ใหม่ต้องดูทันสมัย คม และสอดคล้องกับแนวทางการออกแบบสไตล์ "แมกกาซีน" ของ ICS ด้วย

ฟอนต์ตัวใหม่นี้ยังต้องแสดงผลได้ดีบนหน้าจอของอุปกรณ์รุ่นเก่าอย่าง Nexus S และต้องแสดงผลข้อมูลที่เป็นบล็อคหรือตารางได้ดี ข้อกำหนดสุดท้ายคือฟอนต์ตัวนี้จะมีสถานะเป็น UI font ทำให้มันต้องออกแบบมาให้คนจดจำได้ว่าเป็นฟอนต์ของ Android โดยเฉพาะ

กูเกิลลองออกแบบฟอนต์ Roboto หลายวิธี แต่มาจบลงด้วยฟอนต์แนว grotesque (หรือ grotesk) ซึ่งถือเป็นฟอนต์แบบ Sans ในอดีตตัวหนึ่ง โดยกำหนดให้ด้านข้างของตัวพิมพ์ใหญ่เป็นเส้นตรงเสมอ (ลองดูตัว C ตามภาพประกอบ) และใช้เส้นโค้งลักษณะตาม "โค้งสนามแข่งรถ" เพื่อให้ดูแตกต่างจากฟอนต์ทั่วไป

ส่วนฟอนต์ตัวพิมพ์เล็กจะลดความแข็งของเส้นลงมา เพื่อไม่ให้อักษรโดยรวมดูแข็งเกินไปและอ่านง่ายขึ้น ฟอนต์บางตัวอย่าง e และ g ถูกปรับให้ดู "เปิดอ้า" มากขึ้น ในขณะที่ฟอนต์ a, c, s จะยังดูเกือบเป็นวงกลมปิด

Matias บอกว่ากูเกิลได้ทดสอบการเรนเดอร์ฟอนต์ Roboto ให้ดูสวยงามบนหน้าจอทุกความละเอียด แต่จริงๆ แล้ว Roboto ก็ยังทำไม่เสร็จ โดยกูเกิลจะขยายตัวอักษรที่รองรับให้มากขึ้น และเริ่มทำการ hint ให้ฟอนต์ดูคมชัดขึ้นเวลาแสดงผลบนหน้าจอขนาดเล็กๆ

ที่มา - +Matias Duarte

Comments

By: koalaz
ContributorAndroid
koalaz's blog
on 10/11/11 14:54 #352520 toggle
koalaz's picture

แล้วภาษาไทยล่ะ ...


Inglorious Engineer

By: xxa
Android
xxa's blog
on 10/11/11 14:55 #352521 Reply to:352520 toggle
xxa's picture

+1

By: equilibrate
AndroidUbuntuWindows
equilibrate's blog
on 10/11/11 15:01 #352528 Reply to:352520 toggle
equilibrate's picture

+1 ด้วย ;)

By: toandthen
WriteriPhoneMEconomicsAndroid
toandthen's blog
on 10/11/11 15:21 #352540 Reply to:352520 toggle
toandthen's picture

"โรบฺติโต"


ton.is.my.name | @TonsTweetings

By: kunakorn
AndroidWindows
kunakorn's blog
on 10/11/11 16:05 #352570 Reply to:352520 toggle
kunakorn's picture

tahoma

By: amorny
amorny's blog
on 10/11/11 15:13 #352536 toggle
amorny's picture

+1 ผมว่า เขาน่าจะทำจีนก่อนนะ ;p

By: toandthen
WriteriPhoneMEconomicsAndroid
toandthen's blog
on 10/11/11 15:23 #352542 toggle
toandthen's picture

เรื่องความละเอียดหน้าจอมือถือจริง ๆ น่าตกใจมากเหมือนกัน ห้าปีที่แล้วมือถือส่วนใหญ่หน้าจอยังไม่ถึง 100,000 พิกเซลกันเลย


ton.is.my.name | @TonsTweetings

By: xnone
AndroidWindows
xnone's blog
on 10/11/11 15:30 #352549 toggle
xnone's picture

Domo arigato, Mr roboto

By: bahamutkung
ContributorAndroidIn Love
bahamutkung's blog
on 10/11/11 15:36 #352554 toggle
bahamutkung's picture

ลงไว้แล้วรู้สึกว่าดีกว่า font เดิม แต่ไม่รู้ placebo หรือเปล่า


"With the first link, the chain is forged. The first speech censured, the first thought forbidden, the first freedom denied, chains us all irrevocably."

By: nzgul
nzgul's blog
on 10/11/11 16:00 #352567 toggle
nzgul's picture

ภาษาไทยใช้ได้ครับ (ลองกับ desire)
ตัวมันจะตันๆ นิดนึง แต่ใช้ได้ดี

By: toandthen
WriteriPhoneMEconomicsAndroid
toandthen's blog
on 10/11/11 16:27 #352579 Reply to:352567 toggle
toandthen's picture

screen cap มาให้ดูได้ไหมครับ อยากเห็น :)


ton.is.my.name | @TonsTweetings

By: BlackMiracle
ContributorAndroidWindows
BlackMiracle's blog
on 10/11/11 18:59 #352658 Reply to:352579 toggle
BlackMiracle's picture

อยากเห็นด้วยคน


Pitawat's Blog :: บล็อกผมเองครับ

By: Bugbear
iPhoneWindows PhoneAndroidUbuntu
Bugbear's blog
on 11/11/11 0:46 #352777 Reply to:352567 toggle
Bugbear's picture

ผมลองแกะดูแล้ว Roboto ยังไม่รองรับ font thai ครับ
เท่าที่ดูมีแต่กลุ่มละตินกับสัญลักษณ์ต่างๆ เท่านั้น

อาจเป็นได้ว่ามีการนำ font Roboto(แกะเอาบางส่วนที่เป็นอักษรกลุ่มละติน)
ไปรวมกับ font อื่นๆ เพื่อให้รองรับหลายภาษา

By: cwt
AndroidRed Hat
cwt's blog
on 10/11/11 16:20 #352576 toggle
cwt's picture

ลองอ่านฝ่ายที่ออกมา "แฉ roboto" ดูครับ Roboto is a Four-headed Frankenfont

By: kcc_wera
iPhoneWindows PhoneWindows
kcc_wera's blog
on 10/11/11 17:05 #352609 Reply to:352576 toggle
kcc_wera's picture

อ่านดูแล้ว พูดไม่ออกจริงๆ

By: mk
FounderAndroidRed HatWindows
mk's blog
on 10/11/11 17:33 #352620 Reply to:352576 toggle
mk's picture

ผมเฉยๆ นะ คือ ฟอนต์ลักษณะนี้มันก็หนี Arial/Helvetica ไปได้ไม่เยอะอยู่แล้ว ต่างกันที่ลูกเล่นนิดหน่อยซึ่งคนทำฟอนต์ก็ไปปรับแต่งเอาตามความเหมาะสม

ถ้าใช้ตรรกะแบบนี้ พวก UI font อื่นๆ คงโดนเล่นกันหมดแหละครับ

By: gudgee
iPhoneAndroidWindows
gudgee's blog
on 11/11/11 6:09 #352811 Reply to:352576 toggle
gudgee's picture

มันก็มีเส้นตรงกับเส้นโค้ง อย่างที่เค้าว่านั่นแหละ คงจะทำต่างจากเดิมๆยาก

By: kswisit
ContributoriPhoneAndroidIn Love
kswisit's blog
on 10/11/11 18:03 #352631 toggle
kswisit's picture

ผมคงใช้ฟอนต์ "เปื้อนยิ้ม" เหมือนเดิม :)

By: exFictitiouZ
ContributorAndroid
exFictitiouZ's blog
on 10/11/11 18:21 #352637 toggle
exFictitiouZ's picture

ชอบ typography

อยากเห็นข่าวนี้ก่อนคุณ mk จัง อิ ๆ


twitter.com/exfictz || statigr.am/exfictz

By: GoblinKing
Windows PhoneWindows
GoblinKing's blog
on 10/11/11 19:26 #352667 toggle
GoblinKing's picture

สไตล์ แมกกาซีน = Metro UI สินะ


เขาสูงอาจวัดวา กำหนด จิตมนุษย์นี้ไซร้ ยากแท้ หยั่งถึง

By: mk
FounderAndroidRed HatWindows
mk's blog
on 10/11/11 20:12 #352674 Reply to:352667 toggle
mk's picture

ไม่เหมือนครับ ลองอ่านอันนี้ดูครับ ยาวหน่อยแต่ตอบคำถามได้

Exclusive: Matias Duarte on the philosophy of Android, and an in-depth look at Ice Cream Sandwich

By: tomyum
ContributorAndroidWindows
tomyum's blog
on 10/11/11 21:13 #352701 toggle
tomyum's picture

อะไรนะ ฟอนต์กลุ่ม "โกรเต๊กส์" (ดักแก่นะ)


\(@^_^@)/
my Google+
M R T O M Y U M

By: touchie
iPhoneWindows PhoneAndroidBlackberry
touchie's blog
on 10/11/11 21:39 #352721 toggle
touchie's picture

มาแนวเดียวกับ Nokia Pure เลยนะ...


ดีใจจัง ค้นแล้วเจอเลย

By: Fzo
ContributorAndroidUbuntu
Fzo's blog
on 11/11/11 8:39 #352789 toggle
Fzo's picture

คล้าย Helvetica มาก ผมลงบน S2 ก็จะว่ามัน ก็สวยนะ แต่ไม่ได้ว้าวอะไร แต่รู้สึกว่าถ้าตัว ea อยู่ติดกันแล้วจะมีปัญหาครับ (ลองทั้งบน S2 และ Ubuntu ครับ)


WE ARE THE 99%

By: LazarusSP1
ContributorBlackberry
LazarusSP1's blog
on 11/11/11 16:00 #353015 toggle
LazarusSP1's picture

การทำฟอนต์ ที่งดงาม เพื่อให้คนจดจำสินค้าได้


Send from my BlackBerry