- Sweden Sansは、スウェーデンのブランドコミュニケーション全般におけるアクセシビリティ、シンプルさ、一貫性を担う主要書体で、スウェーデンの古い標識システムに着想を得て制作された
- 可読性が高く、ブランド固有性を維持するよう設計されており、あらゆる適用環境で強いインパクトを発揮するための高い識別性を確保
- Sweden SansはBook, Regular, Semibold, Boldの4つのウェイトで提供され、Sweden Sansを使用できない場合はNoto Sansが代替・補助書体として機能
- Sweden SansとNoto Sansのいずれも使用できない場合は、Arialをフォールバック書体として使用
- デジタル環境では、6pxベースライングリッドに基づく構造化されたタイポグラフィ階層を適用し、一貫したブランド表現を維持
タイポグラフィ階層（Type hierarchy）
- Sweden Sansは主要書体であり、Book, Regular, Semibold, Boldの4つのウェイトを提供
- Sweden Sansを使用できない場合、Noto Sansが代替および補助書体として動作
- Sweden Sansはスウェーデンのブランドアイデンティティの中核要素であり、一貫性の維持、明瞭さの創出、ブランドレガシーの管理を担い、ブランド表現を完全に示す必要がある場合は常に使用
- Noto SansはSweden Sansの代替（セカンダリ）および補助書体であり、非ローマ字言語・特殊文字の代替書体、イタリックなど特殊ウェイトのフォールバックとして使用
- この用途以外での使用はブランド表現力を弱める可能性があるため、可能な限り避ける
主要書体（Main typeface）
- Sweden SansはBook, Regular, Semibold, Boldの4つのウェイトで提供
代替書体（Alternative typeface）
- Notoは世界中のあらゆる言語のサポートを目指すGoogleのフォントファミリーで、Open Font Licenseの下でライセンスされている
- Noto Sansは、Sweden Sansが実際の適用環境や用途をサポートできない場合に使用
- 言語サポートのみを目的とする使用
- 使用できないウェイト（例：イタリック）
- 特殊文字
フォールバック書体（Fallback typeface）
- Arialはフォールバック書体であり、Sweden SansやNoto Sansがインストールされていない、または使用できない場合に使用
- Word文書などの日常的なコミュニケーションでは、Arialの方が適している場合がある
ペアリング（Pairings）
- 提案されたタイプペアリングを使用し、すべてのコミュニケーションで明瞭さ、一貫性、強い階層を確保
- 例として、Level 1 Sweden Sans + Level 2 Noto Sans、Level 1 Sweden SansとLevel 2 Noto Sans Italic/Monoの組み合わせを提示
- Noto Sans Russian、Noto Sans Japaneseなど多言語ペアリングの例を含む
タイプステア（Type stairs）
- タイプステアは、見出しと本文、そしてその間の関係を扱うのに役立つ
- 太字のヘッドラインは、より小さなタイポグラフィと対比され、明瞭さ、一貫性、強い階層を確保
デジタル（Digital）
- スウェーデンのデジタルブランド表現のための主要なタイポグラフィ階層として、6px単位の構造化されたリズムをベースラインとして適用
- 異なるサイズや組み合わせの間を行き来する際に、バランスの取れた相関関係を提供し、全体の表現を維持
- ラベルは、特定の提供物やカテゴリーに関連するヘッドラインとともに控えめに使用
- ユーザーが情報を素早く分類し、カテゴリーや提供物に直接結び付けられるよう支援
- 主にhero領域のカードで、選定プロジェクト、中核的価値、主要な編集コンテンツを説明する際に使用
- すべてのスタイルは暗い背景に白で使用できるが、リンクは例外
間隔（Spacing）
- プラットフォーム全体で合理的かつ連続的なタイポグラフィの流れを実現するため、すべての行間はベースライングリッド（6pxごとに1行）で定義
- すべての間隔は、さまざまな行間とバランスを取るよう、ベースラインに合わせて光学的に設定
- 一般的なルール：ヘッドラインが大きいほど、ヘッドラインと段落の間隔も大きい
ライティング（Writing）
- すべての文脈で可能な限り**センテンスケース（sentence case）**または小文字を使用
- ブランドは聴衆に叫ぶのではなく、語りかける表現を志向
- 大文字は必要な場合にのみ、最大1〜3文字に制限して使用（例：ウェブサイトのカテゴリーラベル）
右から左への読み（Right to left hand reading）
- サブロゴとコンテンツがアラビア語テキストに基づく場合は、提示された例に従う
整列（Alignment）
- テキストは常に左揃え
- Sender systemも常に左揃え
- Sender system内部のロゴは中央揃え
適用例（Applications）
- Sweden Sansファミリーの使用方法の例を提示
- ロゴタイプにSemibold
- ヘッドラインにSweden Sans Bold
- 本文にSweden Sans Book
1件のコメント
Hacker Newsのコメント
タイポグラフィやページデザインに魅了されていて、こういう話は楽しく読むけれど、このレベルの執着に近い細かさがどう維持されているのかはよく分からない
書体や使用条件に注がれる文書化や細部への配慮が、Webサイト運営、APIドキュメント整備、アプリの基本機能に費やす時間よりはるかに大きく見えることが多い
まるで100年かけてオークを育て、手作りのナイフで突板を削り出し、1年間ココナッツオイルに漬けたあと、IKEAのパルプ製ハニカムボードに貼り付けるような感じ
教育分野でかなり大規模なTailwindベースのデザインシステム実装を作ったことがあり、デザインと
tailwind-configは同じ仕様から作られていた。選択肢と可能性を減らして、エンジニアが悩む領域をなくし、パディング・フォントウェイト・行間・色といった値がすべて一貫するようになる行間、パディング、ウェイト、色などから外れたモックアップは誤ったモックアップであり、設定された値がその事実を開発者に示してくれる。仕様から外れたコードも誤ったコードだ。エンジニアリングとUXの間に良いコミュニケーションの流れは必要だが、実際に機能する
うまく動くシステムでは、見るだけでデフォルト値が分かるようになって負担が減る。そしてアプリのバックエンド全体の目的は結局フロントエンドを提供することだ。バックエンドの慣行がどれだけ優れていても、デザインや仕様に合っていなければ顧客に見える失敗になる
デザイン、特にタイポグラフィはアクセシビリティと直結しているので、そうした細部への配慮に値する。コントラストや視覚的階層の定義は、あるデザインがどれだけアクセシブルかに大きく影響する
この例では、今後は大文字テキストをずっと少なく使うようにと言っている部分が特に目に付く。大文字はアクセシビリティの問題でデザイナーと争ったことのある項目で、Microsoftも初期の「Metro」デザインで公然と大きな問題を起こしたあと謝罪し、その後の「Fluent」デザインで元に戻したことがある
人は個々の文字よりも単語の形を読んでいるが、大文字は似たような長方形をたくさん作るため、ディスレクシアのない読者にとっても道路のスピードバンプのように読み速度を落とす。ディスレクシアの読者にはバンプではなく壁のように感じられ、すべて大文字のテキストは事実上アクセス不能になることもある
「見た目がいい」という理由で全部大文字にするデザインをたくさん見てきたが、あるデザイナーには整っていてクリーンに見える形が、別の人には巨大なアクセシビリティバグになり得る
個人的には良いことだと思うし、そういう人たちにはお金を払うべきだと思う
そういう人たちには技術へのアクセス権はたいてい限られているが、グラフィック表現を通じた事実上のブランド表現へのアクセス権ははるかに広い
技術文書と比べて差があるなら、その差は別問題として扱うべきであって、何か別のものがあまり計画的でないとか文書化されていないという理由で、デザインガイドを細かすぎる揚げ足取りと呼ぶべきではない
書体セクションがとりわけ大きいとは思わない。2年間、デザインマニュアルだけを作る会社で働いていたが、よくできたマニュアルはたいていこんな感じだ
最近ではフィンランドのFinlandicaも知ったが、かなり良い: https://toolbox.finland.fi/brand-identity-and-guidelines/fin...
#,&,@は微妙だ。AとGも変で、サンセリフ体に装飾が入った2文字のように見える。iとjもそうではあるただしIはlと区別できるように設計されていて、多くのフォントではそうなっていない
書体やデザインにどれだけ気を配っても、訪問者を迎える方法が「本当に追跡クッキーを望みませんか？」ではあまり意味がない。小さなチェックボックスを2つ押さなければならず、ぼかされた「選択項目のみ許可」の隣に、ユーザー敵対的な太字の「すべて許可」ボタンが置かれている
本当にUXを改善したいなら、こういうもののどれか1つのほうが、もっと気を配る価値がある
ストックホルムのデザインエージェンシーSöderhavetが制作した。詳しくはここ: https://soderhavet.com/work/sweden/
アメリカにはPublic Sansがある: https://public-sans.digital.gov/
https://archive.is/7ytlz
HNのトラフィックで落ちたようだ
archive.xx系サイトで「Safari couldn’t establish a secure connection」と出るのは自分だけなのか気になる。かなり前からずっとそうだったこれは、外国人にスウェーデンのイメージを宣伝することに重点を置いたサイト向けのもののようだ。スウェーデンに住んでいるが、スウェーデンの国家機関の一般的なコミュニケーションでこの書体が使われているのは見たことがない気がする
Swedish Tax Agencyのデザイン言語と呼べるものがあるなら、それは気に入っている。Sweden Sansを使っているようには見えないが、正確には何を使っているのか分からない
「Swedish Instituteは、世界中でスウェーデンへの関心と信頼を築く公的機関です。私たちはスウェーデンのプロモーション、バルト海地域協力、グローバル開発に取り組んでいます。[…] SIの運営は主に国の予算からの直接配分によって財政支援を受けています。SIは、国際協力、国際援助、教育および大学研究、ビジネスの4分野で約4億7千万SEKのスウェーデン政府資金を保有しています。」
[1] https://si.se/en/about-si/our-mission/
https://www.youtube.com/watch?v=qXiIJ32kaZU
スウェーデンにいる誰かが、警察が運転者であることを立証するにはその日のうちに捕まえなければならないと言っていたが、私はドイツのアウトバーンを走り続けるつもりだ。野放しのヘラジカが少ないから
ghost rider patrik fürstenhoff
名前はSweden Sansなのに、小文字のiやlのような一部の文字にはセリフがあるように見える。私がセリフを誤解しているのか、それともここでのサンズの意味を取り違えているのか分からない
2000年代にタイポグラフィを教えていたとき、学生たちはこういう点を指摘していた。初級クラスの例として、書体をきちんと見ずに使ってしまい、後になって特定の細部に引っかかることもあった
奇妙だが、たいていの人は書体そのものを深く考えずに選ぶ。名前を読むどころか、じっくり観察すらしない。自分のデザイン、考えや感情、メッセージ、クールなデザインの機会のことしか考えていない
熟練したデザイナーは、自分が書体の目的を実質的に幻覚しているのではないかと考える訓練を受けるべきだ。数秒見ただけでも本来の目的が非常に明確になることが多いからだ。この仕組みを学べば、なぜそうしたスラブセリフが入ったのかもはっきり見えてくる
多くのサンセリフ書体でも、特に見分けにくいlのような文字には少しセリフが入る。技術的な文脈で使われたり、この書体のように汎用的に使われる書体ならなおさらだ
セリフと呼ぶと、人はもっとずっとセリフらしい書体を期待するだろうから、サンセリフと呼ぶほうが単純なのかもしれない
フランスにも独自のデザインシステムと書体Marianneがある: https://www.systeme-de-design.gouv.fr/elements-d-interface/f...
https://wir.berlin/kampagnen/die-typo
https://www.rijkshuisstijl.nl/publiek/modules/product/Digita...
https://fonts.tourismni.com/
ウェブサイトでコンテンツを探すのが悪夢のようなので、デザインガイドラインへのリンクも貼っておく
https://www.visiteuropewithskal.eu/wp-content/uploads/2021/0...
スウェーデンをけなすつもりはないが、エストニアにも似たようなものがある: https://brand.estonia.ee/guidelines/typography/?lang=en
紹介では Estonia ブランドの性格を「nordic, surprising, smart」としているが、特に Aino 書体は surprising に寄りすぎて可読性を犠牲にしているようで、その結果 smart の要素の表現は明らかに弱くなっている