韓国のデジタル政府サービス UI/UX ガイドライン、KRDSへ発展

 (krds.go.kr)
42 ポイント 投稿者 carnoxen 2025-01-23 | 12件のコメント | WhatsAppで共有

韓国の行政・公共機関のWebアプリケーションを作る際に適用するデザイン項目を示すサイトです。2025.1.16、「デジタル政府サービス UI/UX ガイドライン」から「韓国デザインシステム（KRDS）」という名称に新たに変更されました。

主な変更点

  1. 新規ガイドラインを追加（11種）
    • デザインスタイル : エレベーション（Elevation）、高コントラストモード（High contrast mode）
    • ナビゲーション : タブバー（Tab bars）
    • レイアウトおよび表現 : スプラッシュスクリーン（Splash screen）、テキストリスト（Text list）
    • 選択 : トグルスイッチ（Toggle switch）
    • ヘルプ : ツールチップ（Tooltip）
    • 設定 : 言語変更（Language switcher）、画面サイズ調整（Resize）
    • コンテンツ : アクセシブルなメディア、非表示コンテンツ（Visually hidden）
  2. 既存ガイドラインの詳細内容を改善し、標準プロトタイプを補完（20種）
    • デザインスタイル（5種） : 色（Color）、タイポグラフィ（Typography）、形状（Shape）、レイアウト（Layout）、アイコン（Icon）
    • コンポーネント（7種） : 運営機関識別子（Identifier）、ヘッダー（Header）、フッター（Footer）、メインメニュー（Main menu）、ラジオボタン（Radio button）、セレクト（Select）、ファイルアップロード（File upload）
    • 基本パターン（2種） : 入力フォーム、フィルタリング・並べ替え
    • サービスパターン（6種） : （検索）検索語入力、（検索）検索結果確認、（検索）詳細検索、（ログイン）ログイン情報入力、（ログイン）サービス利用、（申請）サービス情報確認

関連項目

関連記事

12件のコメント

 
bobross0 2025-02-05

なぜ、よくできているのに……
 
jjpark78 2025-01-24

こんなことをやる余裕と意思があるなら、そのままJavaとSpringフレームワークを取り除くことにも少し力を入れてほしい…。

セキュリティレベル、テスト通過品質、標準通信規格、認証標準などだけを強力かつ抜け目なく整備して、

中小企業が言語やフレームワークに縛られず自由に開発できればと思う。

死にかけているJavaという言語に命綱をつないでいる大韓民国政府フレームワークの技術ロックインによる否定的な効果が、後になってどんな雪だるまになるのかとても不安だ。
 
carnoxen 2025-01-24

Javaの代替は見つけられるかもしれませんが、Springの代替はどうでしょうね……
 
techtech 2025-01-24

とても良いですね！！
 
riki3 2025-01-23

?? なぜでしょう.. うまく作ったのでしょうか?
 
jic5760 2025-01-24

wwwwww 本当にどうしてこんなに良くできてるんだろう……
ちょっとTossっぽさもありますね
 
white9s 2025-01-23

かなり力を入れて作られたようで、クオリティが素晴らしいです。
今後も継続的に管理されるといいですね。
 
savvykang 2025-01-23

各国の政府向けデザインシステムの参考資料です。 https://github.com/ctdesign/gov-design-systems-list/…
 
bbulbum 2025-01-23

以前の政府サービスガイドラインのときに見て、ガイドが本気でよくできているなと思っていましたが、さらに後押しするようですね。
公共機関特有のあの雰囲気は私の好みには少し違和感がありますが、悪くないですね。
 
bbulbum 2025-01-23

github と figma のリンクもありますね
 
nemorize 2025-01-23

思ったよりずっと良いですね…？！
 
felizgeek 2025-01-23

JS、CSSで導入でき、コンポーネントのサンプルコードもあります。
依存関係なしで実行できるので素晴らしいです。

<link href="https://cdn.jsdelivr.net/npm/krds-uiux@1.0.1/…; type="text/css" rel="stylesheet" />
<script defer src="https://cdn.jsdelivr.net/npm/krds-uiux@1.0.1/…;

Component Headのコードも含まれています。
https://www.krds.go.kr/html/site/component/component_02_03.html