新デザインのご紹介

クラウド版Garoonでは2018年2月〜5月にかけてデザインを変更いたしました。「標準」デザインとして新しいテーマを追加するとともに、今までご利用いただいていたデザインを改善いたしました。従来のUIを踏襲しながら、より見やすく使いやすいデザインを目指しました。ぜひお試しください。

新しい「標準」デザインを追加 + 今までのデザインを改善

新デザインテーマ 3つのポイント

ヘッダーをより使いやすく

見やすく操作しやすいUIパーツ

アクセシビリティへの対応

ヘッダーをより使いやすく

全てのデザインテーマでヘッダーを見直し、スケジュールなどのアプリケーションに、ヘッダーからアクセスしやすくなりました。アプリメニューを閉じたままでも利用しやすいため、広い画面領域を確保できます。

アプリメニューを閉じた状態でも使いやすく、広い画面領域が確保できるようになりました。

気になるポイントを解説!

  • 以前のように、ポータルにアプリメニューを表示したいです。
  • ヘッダー下のをクリックすると、従来通りアプリメニューを表示できます。

従来と同じように、アプリメニューを表示できます。

  • デザイン変更のやり方を教えてください。
  • ユーザー名をクリックし「デザイン設定」を開きます。
    設定したいデザインのラジオボタンを選択した状態で「設定する」ボタンをクリックします。

見やすく操作しやすいUIパーツ

画面配置やボタンなどのパーツの1つ1つを改善し、より見やすく、操作しやすくなりました。

ポータル スケジュールの登録画面
新デザイン
従来デザイン
  • 従来よりも余白を多くとりすっきりした画面になりました。
  • アイコンをフラット化したり、フォントをメイリオ * に変更するなど、より見やすいよう改善しました。

* Windows、日本語環境のみ

気になるポイントを解説!

  • 余白を広くとると表示できる情報が少なくなってしまいませんか?
  • 余白が広い方が画面上の情報がまとまって認識できるようになり、どこに欲しい情報があるか見やすくなります。
    また、ボタンやタブなどが押しやすくなるため、操作性の向上につながります。
余白少なめ 余白多め

アクセシビリティへの対応

Garoonではアクセシビリティの強化に取り組んでいます。
新デザインでも、ボタンのコントラストなどでWCAG2.0に配慮しました。

コントラスト⽐の⽐較

登録ボタン タブ 却下ボタン
新デザイン

4.6:1


4.6:1


4.9:1


従来デザイン

2.53:1


1.99:1


3.9:1


  • ボタンやタブのコントラスト比について、WCAG 2.0 の基準値の 4.5:1 をクリアしました。

*新しい「標準」以外のデザインでは、一部のパーツは非対応です。

画面拡大(2倍)時の比較

新デザイン
従来デザイン
  • アイコンの要素を減らし、高画質なデータにしたことで拡大して表示したときにも見やすくなりました。

気になるポイントを解説!

  • アクセシビリティとはなんですか?
  • Webを利用するすべての人が年齢や身体的制約、利用環境などに関係なく自由にWebにアクセスできること、そしてコンテンツや機能を制限なく利用できること、そのアクセス性を確保することをアクセシビリティと言います。サイボウズのアクセシビリティに対する取り組みについてはこちらをご参照ください。
  • WCAGとはなんですか?
  • Web Content Accessibility Guidelines (WCAG) 2.0 は、ウェブコンテンツをよりアクセシブルにするための推奨事項を網羅したガイドラインです。このガイドラインに従うことで、様々な障がいのある人を含めたほとんどの利用者にとってウェブコンテンツがより使いやすくなります。WCAG 2.0 の達成基準として、コントラスト比は4.5:1以上と規定されています。
  • なぜ拡大したときの表示が重要なのですか?
  • 目に障がいのある方などは日常的に画面を拡大して利用することが多いため、画面拡大時の表示を見やすくすることで、アクセシビリティが向上します。

デザイン以外にもさまざまな機能をアップデートしました。
詳しくはアップデート情報をご確認ください。

新デザイン適用スケジュール

2018年2月
  • ・新しい「標準」デザインを先行公開しました。
2018年5月
  • ・従来のデザインテーマを改善いたしました。(ヘッダーや余白などの仕様を変更しました)
  • ・2018年5月以降、新規にクラウド版Garoonをご購入いただいたお客様のデフォルトデザインは新しい「標準」デザインになりました。

    標準

  • ・2018年5月以前に「標準」と呼んでいたデザインは「クラシック2011」と名称を変更しました。

    クラシック2011

  • ・詳しい変更点は以下の資料をご覧ください。
スライドを見る

ダウンロード

よくあるご質問

2月の先行公開の際に多くいただいたご質問について回答いたします。

昔のデザインに戻したいです

ユーザー名をクリックし「デザイン設定」を開きます。
設定したいデザインのラジオボタンを選択した状態で「設定する」ボタンをクリックします。
詳しくはマニュアルをご覧ください。

▼画面のデザインを設定する(クラウド版Garoon オンラインマニュアル)
https://jp.cybozu.help/ja/g/user/usable/screen/design

以前のように、ポータルの上部にアプリメニューを表示させたいです
ヘッダー下のマークをクリックするとアプリメニューを表示できます。
フォントが見づらいです
Windowsをご利用の場合、ディスプレイの設定でClearTypeを有効にすることで改善する場合があります。
「アプリ一覧」はなくなったのですか?
申し訳ございません、「アプリ一覧」は廃止させていただきました。
新しく設置した左上のアプリアイコンからアクセスをお願いいたします。
フォントを戻したり変更することはできますか?
申し訳ございません。フォントは変更いただけません。
ヘッダーの色を変更することはできますか?
申し訳ございません。ヘッダーの色は変更いただけません。

ご意見をお待ちしています

Garoonに関するご意見を募集しております。
新デザインを使ってみた感想や、もっとこうして欲しい、といったご要望をぜひお寄せください。

意見を投稿する

Garoonのヘッダーからもご意見を投稿いただけます

ご意見投稿フォームへのリンクがございます