Teranoptia - แบบอักษรที่ชวนให้นึกถึงสิ่งมีชีวิตคิเมรา

 (tunera.xyz)
3 คะแนน โดย GN⁺ 2024-05-03 | 1 ความคิดเห็น | แชร์ทาง WhatsApp
  • Teranoptia ไม่ใช่ฟอนต์สำหรับอ่านตัวอักษร แต่เป็น แบบอักษรที่ไม่ใช่ตัวอักษร ซึ่งทำให้สามารถสร้างสิ่งมีชีวิตคล้ายคิเมราและลวดลายตกแต่งได้ผ่านการพิมพ์แป้นพิมพ์
  • อิงจากภาษาภาพที่มาจาก Bayeux Tapestry, ภาพประกอบยุคกลาง และหนังสือเด็ก โดยผสมรูปทรงของ พืชและสัตว์ เข้าด้วยกัน
  • สามารถใช้ตำแหน่งของตัวอักษรราวกับเป็นเครื่องมือสร้างภาพ เพื่อทำกรอบตกแต่ง จินตนาการสัตว์ประหลาด และสร้าง ลวดลายในระยะขอบ (marginalia) ของเลย์เอาต์
  • เวอร์ชันแรกมีตัวอักษร A-Z เครื่องหมายกำกับเสียงบางส่วน และสัญลักษณ์บางรายการ โดยมีแผนจะเพิ่มองค์ประกอบประเภทอื่นในอนาคต
  • ใช้งาน แจกจ่าย และดัดแปลงได้ฟรีภายใต้ SIL Open Font License แต่ต้องให้เครดิต Tunera และผู้ออกแบบร่วมด้วย

แบบอักษรที่สร้างสิ่งมีชีวิตแทนตัวอักษร

  • Teranoptia ไม่ใช่แบบอักษรทั่วไปสำหรับแสดงข้อความ แต่ทำงานด้วยการวางสิ่งมีชีวิตหรือองค์ประกอบตกแต่งที่จับคู่กับตัวอักษรที่ผู้ใช้พิมพ์
  • แรงบันดาลใจด้านภาพมาจาก Bayeux Tapestry, ภาพประกอบยุคกลาง และหนังสือเด็ก โดยเวอร์ชันแรกเน้นการแสดงออกของพืชและสัตว์เป็นหลัก
  • วิธีใช้งานเน้นด้านการตกแต่ง
    • สร้างกรอบตกแต่ง
    • จินตนาการสัตว์ประหลาดหรือสิ่งมีชีวิตแบบคิเมรา
    • เพิ่มองค์ประกอบสไตล์ marginalia ให้กับเลย์เอาต์

ชุดอักขระที่มีและการขยายในอนาคต

  • เวอร์ชันแรกมีตัวอักษร A-Z เครื่องหมายกำกับเสียงบางส่วน และสัญลักษณ์บางรายการ
  • องค์ประกอบปัจจุบันมุ่งเน้นไปที่การแสดงพืชและสัตว์ และมีแผนจะรวมองค์ประกอบประเภทอื่นเพิ่มเติมในอนาคต

ดาวน์โหลดและสัญญาอนุญาต

  • PDF Specimen: PDF ตัวอย่างของ Teranoptia
  • Download teranoptia!: ดาวน์โหลดแบบอักษร
  • SIL Open Font License: ใช้งาน แจกจ่าย และดัดแปลงได้ฟรี
  • ผู้ออกแบบคือ Ariel Martín Pérez และต้องให้เครดิตแก่ Tunera และผู้ออกแบบ

บทความที่เกี่ยวข้อง

1 ความคิดเห็น

 
GN⁺ 2024-05-03
ความคิดเห็นจาก Hacker News

  • เจ๋งมาก เช้านี้ลองผสม critter ดูแล้วสนุกพอสมควร
    เพื่อให้ลองเล่นได้โดยไม่ต้องดาวน์โหลดเอง ผมทำ หน้าเล็ก ๆ บนเว็บของผมสำหรับลองใช้ฟอนต์ใน textarea ไว้แล้ว
    https://epiccoleman.com/posts/2024-05-02-teranoptia-playgrou...
    อยากทำตารางสัญลักษณ์ด้วย และน่าจะดีถ้าให้ดาวน์โหลดสิ่งมีชีวิตที่สร้างด้วย html2canvas เป็นรูปภาพได้ อาจจะลองทำหลังเลิกงาน

    • ผู้สร้างฟอนต์นี้ทำให้เข้ากันได้กับ Glyph Drawing Club ซึ่งเป็นตัวสร้างรูปทรงแบบโมดูลาร์ที่ผมทำไว้ด้วย
      ถ้าลากไฟล์ otf หรือ ttf ไปวางในหน้าต่างแอป ก็จะโหลด glyph เข้ามาเป็นรูปทรง SVG ให้เอาไปวาดได้ ข้อดีคือมันทำงานแบบ 2 มิติ ใช้ปุ่มลัด r เพื่อหมุน หรือ i เพื่อกลับด้านได้ และส่งออกผลลัพธ์เป็น SVG หรือ PNG ได้
      https://glyphdrawing.club
    • สิ่งมีชีวิตด้านล่างของหน้าก็แก้ไขได้อยู่แล้ว
    • /assets/me.jpg เป็น รูปภาพขนาด 1.3MB แต่บนหน้าเว็บแสดงแค่ขนาด thumbnail เล็ก ๆ เท่านั้น
    • แม้จะผ่านมาไม่กี่วันแล้ว แต่ดูเหมือนว่าโพสต์ไว้ตรงนี้จะเป็นธรรมชาติที่สุด ผมเลยทำ ชีตสรุปเล็ก ๆ ของตัวเลือกทั้งหมดที่ใช้ได้
      คลิกแล้วจะคัดลอกอักขระนั้นไปยัง clipboard จึงมีประโยชน์เวลาใช้อักขระแปลก ๆ ที่ไม่มีบนคีย์บอร์ด
      https://epiccoleman.com/posts/2024-05-05-teranoptia-cheatshe...
    • ขอบคุณนะ ช่วงนี้คงชินกับ Google Fonts ไปแล้ว พอเป็นเว็บโฮสต์ฟอนต์เลยคาดว่าจะมี ช่องพิมพ์พรีวิว แบบนี้
      แก้ไข: เพิ่งรู้จากคอมเมนต์พี่น้องว่า placeholder text แก้ไขได้ นึกว่าเป็นของตกแต่ง

  • การตีความ อักขระสัญลักษณ์ บางตัวดีมาก ลองดูอย่าง - * ($) [$$] {$$$} ,
    โดยเฉพาะดอกจันที่เป็นปลาดาวนี่ชอบมาก เข้ากับบุคลิกของฟอนต์นี้ดี
    ถ้าตัวพิมพ์ใหญ่เรียงลำดับเหมือนตัวพิมพ์เล็กจะดีกว่านี้ ตอนนี้ถ้าจะกลับด้าน a ต้องพิมพ์ Z ถ้าจะกลับด้าน b ต้องพิมพ์ Y พอถึงแถวกลาง ๆ ของตัวอักษรก็เริ่มงง

    • ผมไม่รู้เลยว่ามี ช่องข้อความพรีวิว อยู่ด้านล่างของหน้า มันดูเหมือนของตกแต่งอีกอย่างหนึ่งบนหน้า
    • ถ้าใช้คีย์บอร์ดเยอรมัน พวกนี้ก็น่าลอง: AltGr-X หรือ Y เป็นท่อสองทิศทาง, AltGr-E เป็นแถบแนวตั้ง, AltGr-J เพิ่มจุดเรียงแนวตั้งไว้ใต้ตัวอักษรสุดท้าย
      การกดร่วมกับ Shift จะกลับรูปแบบการจัดวางด้วย
      แก้ไข: เพิ่งนึกได้ว่า J เป็นฟังก์ชันซ้อนสัญลักษณ์ของคีย์บอร์ดเยอรมัน ไม่เกี่ยวกับฟอนต์นี้
    • ใช้ ligature เพื่อสร้างหัวกับหางอัตโนมัติได้ไหม? เช่น ให้ตัวอักษรแรกของคำเรนเดอร์เป็น หัว เสมอ และตัวสุดท้ายเป็นหางเสมอ

  • ผมกำลังทำการ์ด Pokémon กับลูกวัย 6 ขวบ และสร้าง ภาพตัวละคร AI ที่อิงจากคิเมราด้วย
    เมื่อเช้านี้ระหว่างไปโรงเรียน เราจินตนาการถึงอัศวินหุ้มเกราะเต็มตัว+แมงป่อง ร่างพื้นฐานคือ knightstrike, ขั้น 1 คือ knightbite, ขั้น 2 คือ knightflight
    ผมตั้งใจจะติดตั้งฟอนต์นี้ใน Raspberry Pi ของลูกให้ได้ น่าจะเป็นวิธีสนุก ๆ ในการสำรวจคีย์บอร์ด

    • อยากรู้ว่าทำอย่างไร ผมก็อยากลองเหมือนกัน

  • น่าสนใจ สำหรับการนำทางและแผนที่ ถ้ามีฟอนต์ที่แสดงทิศการเลี้ยว ป้ายทางหลวง และป้ายจราจร ก็น่าจะช่วยให้คนคิดในมุมของ ทิศทางหรือแนวทิศ ได้
    เพราะเป็น glyph ที่จำได้ จึงลดความจำเป็นในการเรียนไวยากรณ์และคำศัพท์ใหม่ ๆ ความหมายถูกเข้ารหัสไว้อย่างเป็นธรรมชาติในภาษาที่มีอยู่แล้ว

    • ⬆⬇↗↖↔↩

  • สนุกมากจริง ๆ
    ถ้าสร้าง “สิ่งมีชีวิต” จากคำจริงได้คงน่าพอใจมาก ตอนนี้สระทั่วไปจำนวนมากเป็น ชิ้นส่วนปลายสุด คือหัวหรือหาง

    • regex สำหรับสิ่งมีชีวิตที่หันไปทางซ้ายคือ ^[aeimpvy][bcfgjknqtw]*[dhloruxz]$
      อย่างที่ชี้ไว้ สระทั้งหมดอยู่ในชิ้นส่วนปลายสุด ดังนั้นไม่มีสิ่งมีชีวิตที่ลำตัวช่วงกลางยาวเกิน 2 ตัวอักษร ผลลัพธ์ประมาณคำเหล่านี้: ad ago ah and ankh awl ax ego eh end er etch ex id inch into itch
      อาจรวมคำที่ประกอบด้วยหลายสิ่งมีชีวิตด้วย ตัวอย่างที่ชอบคือ aggrandizer, alexander, equalizer, inlander, mumbler, phalanx, poacher, prelingual, voided
      0: https://regexdictionary.com/regex?r=%5E%5Baeimpvy%5D%5Bbcfgj...
      1: [https://regexdictionary.com/regex?r=%5E(%5Baeimpvy%5D%5Bcfg...](https://regexdictionary.com/regex?r=%5E(%5Baeimpvy%5D%5Bbcfgjknqtw%5D*%5Bdhloruxz%5D)*%24\)*
    • ไอเดียดี น่าจะต้องใช้ ligature หรือวิธีซ้อน glyph หรือกลับทิศทาง

  • ว้าว ดูเจ๋งจริง ๆ
    ไม่เคยเห็นการใช้ฟอนต์แบบนี้มาก่อน
    มีตัวอย่างอื่นอีกไหม?

    • Fontemon เป็นเกมสไตล์ Pokémon ที่เล่นได้และรันอยู่ในไฟล์ฟอนต์
      https://www.coderelay.io/fontemon.html
    • https://www.sansbullshitsans.com/
      ฟอนต์ที่เปลี่ยน buzzword ทั้งหมดให้เป็นแถบเซ็นเซอร์สไตล์ Comic Sans
    • คอมพิวเตอร์ ยุค 8-bit อย่าง C64 ต่างก็ใช้ฟอนต์ monospace และมี glyph สำหรับสร้างขอบหรือเส้นต่าง ๆ อยู่ในฟอนต์
    • https://www.vectrotype.com/chartwell
    • Zapf dingbats :)

  • สนุกมากจริง ๆ
    แปลกใจที่ไม่มี คู่มือ ว่าตัวอักษรไหนแมปกับซ้าย/ขวา, เริ่ม/กลาง/จบ
    แถมการเลือก mapping ก็ไม่ค่อย intuitive เช่นอาจทำให้ง่าย ๆ เป็น a-g คือส่วนเริ่ม, h-t คือส่วนกลาง, u-z คือส่วนท้ายก็ได้

    • ผมลองแมป A-Z, a-z ลงใน สเปรดชีต เพื่อสร้างคิเมราแบบสุ่ม
      https://imgur.com/a/pMKdX3i
      https://twitter.com/dchest/status/1786033028034125984
      รายการของตัวที่หันจากซ้ายไปขวาคือ: const tails = "dhloruxzER", const bodies = "bcfgjknqtw", const heads = "aempsy"

  • อาจจะนอกเรื่องนิดหน่อย แต่สงสัยว่าทำไมถึงใช้คำว่า typeface บ่อย ๆ รวมถึงที่นี่ด้วย ทั้งที่มีคำที่สั้นกว่าและเป็นที่รู้จักมากกว่า
    ว่าไปแล้ว ผมชอบฟอนต์สร้างสรรค์นี้มากจริง ๆ

  • ในที่สุดก็มีฟอนต์ที่ช่วยให้จินตนาการถึง สิ่งมีชีวิตคิเมรา ได้แล้ว

  • น่าจะเหมาะมากกับ tabletop RPG

    • เห็นด้วย และยังนึกถึงการใช้ร่วมกับ OpenSCAD เพื่อใส่ ลายตกแต่งแบบแกะเว้า บนกล่องใส่ลูกเต๋าด้วย