「O」と「0」など、文字の中には見分けにくい組み合わせが存在しています。そうした紛らわしい文字をIDに使用するべきでないと人材マッチングプラットフォーム「Contra」の共同創業者兼CTOのガジュス・クジナス氏がブログに投稿しました。 Understanding and avoiding visually ambiguous characters in IDs https://gajus.com/blog/avoiding-visually-ambiguous-characters-in-ids クジナス氏は見分けにくいものとして下記の組み合わせを挙げました。 ・「O」と「0」 数字のゼロがスラッシュやドットで区切られていないフォントでは、大文字のオーと数字のゼロが非常に似ていることがあります。 ・「I」と「l」と「1」 大文字のアイと小文字のL、そして数字の1は多くの印刷物において区別で
元ネタ 元ネタはこちらです(以下「Figma と PHP」で略します)。 読んでなるほどと思いました。このように、誰かが苦労したおかげで後続が楽になるので感謝です。何が問題点として生じるのか、どんな解決方法が考えられるのか、が予め判明しているだけでもだいぶ楽になります。 反面、$\LaTeX$ の方が実装は簡易ではないかと思ったので、それを実践してみました。 条件と問題点 Figma と PHP の 44 ページに以下のような条件があります 改めて、満たしたい条件 ミリ単位で細かく帳票をデザインしたい。 帳票デザインの保守性を維持するためにはビジュアルデザイン必須 印刷時に見た目が一切崩れない さらに、次のような障害を次々とクリアしていってます。 文字参照の問題 枠からのはみ出しの問題 右寄せの問題 自動折り返しの問題 連票の問題(簡易な解説のみ) これらを $\LaTeX$ と Pyth
そんな事もあり、4月10日は新しいフォントがいくつか発表された。今年の目玉はなんといっても「和文バリアブルフォント」であろう。 われわれが普段使用するフォントは、同じデザインでも細いもの、太いもの、横が詰まったものなどがそれぞれ個別のフォントとして提供され、1つのファミリーを形成している。 一方バリアブルフォントは、そうした文字の変形を1つのフォントで提供していこうという比較的最近のフォントフォーマットで、米Adobe/米Apple/米Google/米Microsoftが共同開発した。フォントパラメータとして、太さや字幅がバリアブルで変更できるため、従来はファミリーで提供しなければならなかったフォントデータが、1つのフォントで小さく提供できるというメリットがある。 もちろんデザインする側も、細いか太いかの2択ではなく「中間」も選べるし、縦長、横長も選べるので、表現の幅が広がるわけである。た
大日本印刷(DNP)は4月23日、音声をリアルタイムで文字に変換し、目立たせたい単語を強調して透明スクリーンに表示する「DNP対話支援システム」を発売した。感情などを表す単語について、自動で最適なフォントを選んで表示するする機能が特徴だ。 聴覚障がい者や高齢者など、音声を聞き取ることが困難な人に対応する窓口や、訪日外国人など日本語音声でコミュニケーションしづらい人を案内する窓口などでの利用を想定する。 会話をリアルタイムで文字化・翻訳するアイシンの音声認識システム「YYSystem」と、感情や話題に合わせたフォントに自動で切り替える「DNP感情表現フォントシステム」を連携して実現した。文字は透明スクリーンに表示することで、相手の表情を見ながら対話できるようにした。 音声認識されたテキストをリアルタイムで解析し、感情やイメージなどを表す単語を12種のフォントから自動的に最適なものを選択して表
CSSでOpenTypeフォントの機能を制御できるようになった結果、欧文ページで font-feature-settings: "dlig"; が指定してあると、日本語に機械翻訳して読もうとした時に合字になって欲しくないところまで合字になってしまう。 「〜になります。」が「〜になり〼。」になる。— りんご🍏夜明けのリモートワーカー (@mstssk) April 17, 2024 本日は晴天なり <div style="font-feature-settings: 'nalt';"> 本日は晴天なり </div> 環境にインストールされているフォント次第だと思うので、手元のスクショも。 ※mac上のChrome。 記事を書いたきっかけのツイート https://twitter.com/yodare_inu_/status/1780431031218343978 参考 font-featu
2024年2月22日 於:株式会社モリサワ Font College Open Campus 12「日本語デザインを変えた技術 発明100年に1から知りたい写植の話」(ネット聴講) 題字 写植の印字:駒井靖夫(プロスタディオ) 協力 株式会社モリサワ、今田欣一 ●想像を大きく超えた報せ 1990年代後半からDTP化が進展したことにより写植が衰退し、会社の方針からDTPに開放されなかった写研書体。あれから30年ほどの月日が経っていました。 2022年11月24日は画期的な日でした。写研・モリサワ・字游工房の共同開発により、写研書体のうち石井明朝体と石井ゴシック体をDTP用のデジタルフォントとして改刻し、2024年にリリースすると発表されたのです。フォント開放に向けた具体的な動きを見ることができ、興奮を禁じ得ませんでした(→写植レポート「写研が動いた日2022 石井書体の改刻プロジェクト」)
「になロマン」「ネコミミフォント」「おまつりふぉんと」など、楽しくてかわいいフリーフォントをたくさんリリースされている213ちゃんから、新作フリーフォントがリリースされました! 今回は、筆の入りがくちばしだったり、濁点・半濁点がたまごにデザインされた、鳥をあしらったフォント「くちばしフォント」 フォントの日(4/10)のまとめ記事で漏れてしまったので、紹介します。 くちばしフォント【商用可】 どの文字もかわいいのですが、特に気に入った文字をピックアップしてみました。 「う」はなんかの生き物みたい、たまごもいっぱいあります、「く」はたまごを狙ってますね。止まり木の「カ」片足立ちの「オ」羽根みたいな「ヒ」とかもいいですねw 鳥にちなんだ漢字もいくつか揃っています。 ではさっそく、フォントのダウンロード方法を。 下記ページにアクセスし、「無料ダウンロード」をクリックすると、ダウンロードできます(
はじめに こんにちは。calloc134 です。 自分は以前から Linux パソコンを欲していたのですが、ついに先日、ThinkPad を購入し、Manjaro Linux をインストールしました。 ここでは、セットアップ手順についてまとめていきます。 完成形 以下のようなデスクトップが完成しました。 利用したもの Manjaro Linux Cinnamon Edition White Sur GTK Theme White Sur Icon Theme Noto Sans CJK JP WezTerm Zsh Sheldon Starship Neovim fcitx5-im 事前準備 Linux を導入するための ThinkPad を購入します。 自分は以下のスペックで購入しています。 ThinkPad X13 Gen 4 AMD Ryzen 7 PRO 7840U 32GB RA
この記事が公開される4月10日は、アドビ社が制定した「フォントの日」です。 モリサワでもこの記念日に合わせてAdobeさんのイベントに参加したり、フォントに関する情報公開をしたり、noteで記事を公開したりと、さまざまな活動をしています。 さて今回は、2月22日に開催した配信イベント Font College Open Campus 12「日本語デザインを変えた技術 発明100年に1から知りたい写植の話」の中で公開した2024年リリース予定の写研フォントについて、詳しくお伝えします。 モリサワと写研写研書体は1970年代から2000年前後にかけて盛んに使われていたため、トップ画像をご覧になる方の中には、懐かしさを感じる方もいらっしゃるかもしれません。 それぞれの書体をご紹介する前に、モリサワと写研についておさらいします。 話は今から100年前に遡ります。 1924年、モリサワの創業者である
Adobe CCユーザーに朗報! Adobe Fontsに日本語フォントが大量追加、CCユーザーは全部無料で使えます 大量に日本語フォントが追加されたので、詳しくは上記ページをご覧ください。Adobe FontsはAdobe CCユーザーはもちろん全部使えますが、無料アカウントの人でも使えるフォントが2,000個以上あります。 続いて、「かりぐらスキップ」「クラフト明朝」など人気フォントをリリースしているアトリエこたつさんから。 推しゴ 個人・商用サイトで無料利用可。同人誌や各種印刷物なども可。 遠くからの見えやすさに拘った、うちわ制作用のかわいいフリーフォント。もちろん、うちわだけでなく紙デザイン・Webデザイン・動画・ゲームなどにも使用できます。ファンサ文言に対応したフォントも揃っています。 フリーフォントのダウンロードは、サイドバーの「無料ダウンロード」から。
もうすぐフォントの日(4/10)ですね。 もはや恒例にもなった、Adobe Fontsで使用できる日本語フォントが大量に増えました! Adobe FontsはAdobe CCユーザーはもちろん全部使えますが、無料アカウントの人でも使えるフォントが2,000個以上あります。 Adobe Fonts Adobe Fontsは、Adobe CCのユーザーなら追加料金なしで利用できます。もちろん商用利用もOK、詳しくはライセンスページをご覧ください。 フォントのライセンス -Adobe Fonts 今年もAdobe Fontsに日本語フォントが大量に追加され、嬉しいですね! これからも期待大です!! さっそく、2024年4月に追加されたフォントを紹介します。 と、まずは去年のAdobe MAXで追加された「貂明朝アンチック」から。 貂明朝アンチック 「貂明朝アンチック」は、Adobeで初となるマン
第58回吉川英治文化賞を受賞した書体設計士・鳥海修さん(69)の著書「明朝体の教室」(Book&Design、3520円)には、日本で150年の歴史を持つ明朝体の創作手順が記されている。ごく当たり前に日常生活に溶け込んでいる文字を「作ること」を生業(なりわい)としている鳥海さんは「皆をのみ込み、包容力のある“普通の”書体を作りたい」と話す。(瀬戸 花音) 「えー! 活字って人が作ってるんだ」。鳥海さんに読者から届いた実際の反応である。聞き慣れない鳥海さんの「書体設計士」という肩書は、印刷物で使用する文字のフォントを制作する仕事をしている人のこと。「この本は文字を使うみんなに読んでほしい。うちのおやじは、私がどういう仕事をしているのか、いくら説明しても分からないまま死んじゃったんですよ。だから、おやじにも読んでほしいなあ」と笑った。 本書では、明朝体の制作手順を丁寧に細かく説明。漢字、ひらが
お知らせ: Microsoft WordやExcel等でひらがなの入力ができない問題を修正したファイル(20240408a)に差し替えました。ご迷惑をおかけしました。お手数ですが再ダウンロードのほどよろしくお願いいたします。 お知らせ: すみません。結構頻繁にアップデートをしているため、一度ダウンロードした方も、再ダウンロードして頂いた方が良いかもしれないです。最終更新は2024年4月8日4:41です。 ヒント: コピペ 「いちきゅうげんご」のふぉんとを、はいふしています。 どなたでもむりょうで、だうんろーどできます。 りようのせいげんは、ありません。ごじゆうに、ごりようください。 (にじはいふのみ、きんしさせてください) とあるうちゅうの「いちきゅうげんご」を、むりやりこんばーとしたものですので、あまりきたいしないでください。 このふぉんとのりようによる、いかなるとらぶる、そんしつ、そん
いよいよ4月10日開催!フォントの⽇2024「フォントの日だよ全員集合 2024 〜“あらし”が巻き起こるってふぉんと!? 〜」 今年もやってきました、4月10日の「フォントの日」。文字っ子の皆さんとこの日を盛り上げるべく、今年もCC道場のスペシャル番組を放送します。 フォントの⽇2024 フォントの⽇2024 「フォントの日だよ全員集合 2024 〜“あらし”が巻き起こるってふぉんと!? 〜」 開催⽇時:2024年4月10日(水) 20〜21時30分前後 1時間半のオンライン番組 ※昨日は参加ありがとうございました。アーカイブは下記にて視聴いただけます。 第一部:リリース目前!バリアブルフォント 百千鳥の情報解禁!! 記念すべき日にアドビの新たなフォントを紹介します。どんな仕様で、どんなデザインで作られているのか?作成した本人、アドビ プリンシパルデザイナー西塚凉子からご紹介します。また
はじめに デザイナーの toshi です。少しずつ暖かくなり畑仕事も捗ります。(この前、ジャガイモの植え付けとネギを 200 粒蒔きました。おいしく育つといいな 🌱 ) さて、この記事では私のデザインワークを格段に上げる「 Eagle 」とその使い方を紹介できたらと思います。 私は 2018 年頃から Eagle を使い始めてデザインワークの初速が上がったり、画像・素材管理のストレスが確実に減りました。 みなさんは、競合調査やベンチマークにするデザインなど参考にするデータはどのように管理していますか? ブックマークで管理?キャプチャ画像をフォルダで管理?画像管理アプリで管理? はじめに なぜベンチマーク管理と参照が大切だと考えているか 時間の有効活用 自分の基準「だけ」で判断しない 質より量でアイデア出しの初速を高める Eagleを使う前 Eagle とは Eagle の使い方 Eagl
CSSでよく使用する単位といえば、px, r(em)あたりでしょうか。CSSはそれら以外にもたくさんの単位が使用できます。 第3弾となる今回はコンテナクエリに基づく単位(cqw, cqh, cqi, cqb, cqmin, cqmaxなど)の便利な使い方を紹介します。 Container query length units -Going beyond pixels and (r)ems in CSS by Brecht De Ruyte 第1弾・第2弾は、下記をご覧ください。 フォントに基づく相対単位(em, rem, cap, ch, ex, ic, lhなど)の便利な使い方を解説 ビューポートに基づく相対単位(vw, vh, lvh, svh, dvh, vb, viなど)の便利な使い方を解説 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得
こんにちは、エムスリーエンジニアリンググループ/ BIR(Business Intelligence and Research) チーム の遠藤(@en_ken)です。 エムスリーでは、隔週LT大会であるところのTach Talkや、自発的なチーム横断勉強会など、技術交流の取り組みが活発です*1。 私たちのチームでは、そこに加えて新たな取り組みとして「チーム内勉強会」を今年の1月から始めました。今回はこちらの取り組みについて紹介します。 「エムスリーエンジニアリンググループのチーム内勉強会」のAI生成画像です 勉強会の枠組み 勉強会というと、テーマとなる書籍を決めてみんなで読み進めていく輪読会のようなものが一般的かもしれませんが、この勉強会は全員で1つのテーマを進めていく形式は取っていません。 各メンバーが順番に担当します。 各メンバーがやりたい内容を自由に発表します。 毎週1時間の枠を設
CSSでよく使用する単位といえば、px, r(em)あたりでしょうか。CSSはそれら以外にもたくさんの単位が使用できます。 前回はフォントに基づく相対単位でしたが、今回はビューポートに基づく相対単位(vw, vh, lvh, svh, dvh, vb, viなど)の便利な使い方を紹介します。 Relative length units based on the viewport -Going beyond pixels and (r)ems in CSS by Brecht De Ruyte 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに CSSの単位: vwとは CSSの単位: vhとは CSSの単位: vbとviとは、ブロックとインライン CSSの単位: lvh, svh, dvhとは ビューポート単位の解説動画
こんにちは!よしななです。 今回は、プログラミング用のフォントとしてオススメな HackGen フォントを VSCode にインストールし、反映させるまでの手順について備忘録として残します。 これから Windows 11 で開発環境を構築する方のための手助けになればと思います! 目次 対象環境 対象読者 HackGen フォントとは? セットアップ手順 インストール VSCode に反映させる やりたいこと イメージとしては、以下の画像の通り HackGen フォントを VSCode にインストールし、VSCode に反映させるところまでのセットアップ手順を示します。 対象環境 OS Windows 11 VSCode version 1.86 をインストール済みであること https://code.visualstudio.com/download 日本語化拡張機能導入済み環境で実行し
任天堂の人材に対する考え方 任天堂の経営方針 私たちは「娯楽を通じて人々を笑顔にする会社」として、どなたにでも直感的に楽しんでいただける「任天堂独自の遊び」を提供することを目指しています。この独自の娯楽体験を実現するために、ハード・ソフト一体型のゲーム専用機ビジネスを経営の中核に置き、どのような娯楽でも「いつかは必ず飽きられてしまう」という考えのもと、人々を笑顔にするために独創的な商品やサービスを世界中の人々にお届けし続けていきます。 人々を笑顔にする娯楽を 世界中の人々にお届けするために 独創的な商品やサービスをつくってお届けするうえで必要な能力は、数字では計れません。そのため、当社では独創性・柔軟性・誠実さからなる「任天堂DNA」を重要視しています。この任天堂DNAを基盤とし、仕事を通じて社員一人ひとりの成長を最大限に促せるよう、 さまざまな人事施策を取り入れています。また、ゲームやエ
以下のツイートを見て、自分の環境でも再現したので気になって調べてみた。 現象 text-spacing-trim プロパティを Yu Gothic UI のテキストに適用すると、一部の括弧類が重なってしまう。これは値に space-all を設定すると解消される。 halt と hmtx を見る Windows に標準搭載される Yu Gothic UI や游ゴシックには、GPOS テーブルに halt 機能タグが含まれている。 halt 機能タグの正式名称は「字幅半角メトリクス」であり、全角の約物を半角として扱う際などに位置を補正する役割を持つ。text-spacing-trim プロパティの実装においても、この halt の値を見て文字詰めを決定している。 TTX(fontTools が提供する解析ツール)を用いて、Yu Gothic UI/游ゴシック の halt と hmtx(水平
Windows10 以降のWindowsに標準搭載されるようになった「UDデジタル教科書体」というフォントがある。游ゴシックに並んで書体が美しいフォントで、そこらへんのチラシや張り紙などで濫用されているのをよく目にするだろう。 だがUDデジタル教科書体はバリアントが6種類もあって、それぞれがどんなフォントなのかわかりにくい。Word でバリエーションを選ぼうとすると、一覧にはこんな風に並ぶ。 UD デジタル 教科書体 N-B UD デジタル 教科書体 NK-B UD デジタル 教科書体 NK-R UD デジタル 教科書体 NP-B UD デジタル 教科書体 NP-R UD デジタル 教科書体 N-R フォント名を単純に昇順で並べただけで、バリアント順になっていない。これでは何がなんだかわからないので整理してみよう。書体名和文欧文ウエイトUD デジタル 教科書体 N-R等幅等幅標準UD デジ
Chrome の挙動を見てみる 百聞は一見に如かずと言いますので、実際の挙動を見てみます。以下の図では、text-align: justify を指定したテキストボックスに対し、上段には space-first を、下段には従来の挙動である space-all を設定しています。上段は下段に比べて、自然な組版が実現されていることが見て取れます。 文章は 京葉線 - Wikipedia を改変して使用。CC BY-SA 画像からは、以下の挙動が確認できます。 行頭の括弧(橙色) 1 行目のみアキが残り、2 行目以降は行頭のアキが詰まる(space-first であるため) 連続する約物(ピンク色、青色、緑色) 読点→句点、閉じ括弧→閉じ括弧ではアキなし、中黒→括弧、閉じ括弧→開き括弧では二分(1/2)–全角程度のアキに調整される 行末の閉じ括弧(青色) 必要に応じて行末のアキが詰まる 行末の
ひらがなすべてのペア.xlsx カタカナすべてのペア.xlsx エクセルのデータです。記号など追加することもできます。 ひらがなカタカナすべてのペア・タテヨコ.zip イラストレータファイルのセットです。 ひらがなすべてのペア・タテ.ai ひらがなすべてのペア・ヨコ.ai カタカナすべてのペア・タテ.ai カタカナすべてのペア・ヨコ.ai が入っています。フォントを変更し、メトリクス設定を選べば、かな詰め(カーニング)の確認ができます。 コレはなんに使うもの? フォント作りの終わりのほうの工程で、ひらがな・カタカナにカーニングの設定をするわけですけれども、隣り合う組み合わせの数は膨大です。 ひらがな・カタカナはそれぞれ85字以上あります(48字ではありません)から、2字の組み合わせはざっくり計算でも85×85=7225、タテ組とヨコ組、ひらがなとカタカナがあるので7225×4=28900*
CSSでよく使用する単位といえば、px, r(em)あたりでしょうか。 CSSはそれら以外にもたくさんの単位が使用できます。フォントに基づく相対単位(em, rem, cap, ch, ex, ic, lhなど)の便利な使い方を紹介します。 Relative length units based on font -Going beyond pixels and (r)ems in CSS by Brecht De Ruyte 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに CSSの単位: capとは CSSの単位: chとは CSSの単位: emとは CSSの単位: exとは CSSの単位: icとは CSSの単位: lhとは CSSの単位: remとrlhとは CSSの単位: rex, rch, ricとは はじめに
どんなお仕事でも、「伝わる」ものをつくるのって難しいですよね。 はじめまして! 科学コミュニケーター/デザイナーとして活動している、山内と申します! ぜひ気軽に“じーにょ”とお呼びください! 皆さんは、資料や企画書、デザイン物などを制作するとき、どのような工夫をされていますか?内容を作り込む、ライティングをがんばる、ビジュアルを整える、効率を重視する……さまざまなこだわりで取り組まれていると思うのですが、最終目標はみんな変わらないはず。 それは、相手へ的確に情報を「伝える」ことです。 一方的に投げかけるだけでなく、相手の理解や興味を伴うように伝える。つまり、「伝わる」ものをつくることを目指していますよね。でも、それがなかなか難しい。どうにかして「伝わる」ものを作りたい!作れるようになりたい!と思う方は多いのではないでしょうか。 よくよく考えてみると、「伝える」ことは、すなわち「ことば」を交
2024年用、日本語のフリーフォント699種類のまとめをアップデートした際に好評だった「ネコミミフォント」をはじめ、「おまつりふぉんと」など、楽しくてかわいいフリーフォントをたくさんリリースされている213ちゃんから、新作フリーフォントがリリースされました! 今回は、レトロでかわいい「になロマン」 これはぜひ使ってみたくなるフォントですね。 になロマン【商用可】 まずはさっそく、フォントのダウンロード方法から。 下記ページにアクセスし、「無料ダウンロード」をクリックすると、ダウンロードできます(要ログイン、登録無料)。 になロマン【商用可】 「になロマン」は、213ちゃんによる11作目となる商用利用無料のフリーフォントです。ロマンと名にあるように、まさにレトロでロマン溢れるフォントですね。「ベジェ曲線をたくさん使うぞ!」と意識して作成されたとのことです。 ライセンスは独自で、個人でも商用で
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く