Revisions rev19

TAEKO AKATSUKA
Update post.
Updated by taea 2023-02-03 12:39:34 +0900
  • # 今回のリリース内容
  • <img width="2400" alt="teams-new-renewal.png (3.1 MB)" src="https://img.esa.io/uploads/production/attachments/105/2023/02/02/2/dfe8d029-5b7e-4bd5-85d4-cacf17e5587b.png">
  • 新しくチームを作成するときの画面が、新しいデザインになりました。
  • esaを使い始めの一番最初に、チームを作る時の画面です。
  • ## デザイン改善ポイント
  • <img width="2400" alt="teams-new-renewal-design.png (2.0 MB)" src="https://img.esa.io/uploads/production/attachments/105/2023/02/01/2/a0ab41d5-dd91-4c3a-ac4b-6f022feeb67a.png">
  • この画面は、esaの利用を試してくださるユーザーさんが最初に目にする画面のため、より気軽にストレスなく新しいチームを作り、esaを使いはじめていただけるようなデザインを目指して、特に下記の点に配慮しデザインを変更しました。
  • 1. 入力項目をへらす; 「説明文」の入力欄を削除しました
  • - チームについての説明文をそもそも必要としないケースも多そう
  • - 任意の登録で十分なものは、できるだけ初期画面には載せない
  • - (アイコン画像も任意登録だが、こちらは登録の有無が使い勝手を左右するので初期画面に含める)
  • 1. 文言をできる限り短く、具体的に、柔らかく
  • - 例えば…
  • - 「チーム情報は後からでも変更できます」→ 「アイコン」ラベル付近に「後からでも登録できます」という文言を配置
  • - 後者の方が具体的な操作をイメージしやすく、文言も短くて済むので、ユーザーの負荷が低い
  • - 「新規チーム作成」→「新しいチームを作成」
  • - よりユーザー側の目線に沿った、柔らかい表現に
  • 1. センター揃えにして、メリハリのある見た目に
  • - 目線の移動がなるべく少ない画面に
  • - 重要なものは大きく、そうでないものは小さくメリハリをつけて見やすく
  • # (\\( ⁰⊖⁰)/) ヒトコト
  • 新規チーム作成の画面は、普段あまり自分たちでも目にする機会が少なく、つい改善を忘れがちになってしまいました。また性質上、ユーザーさんからの直接のフィードバックもいただきづらい場所というのが、さらに改善を後回しにしてしまう要因になっており、サービス初期の古いデザインを残してしまっておりました :cold_sweat:
  • しかし、新しいユーザーからの第一印象を左右する画面なので、本来はきれいにわかりやすくしておきたい場所です。
  • 既に普段 esa を使ってくださってる方は、あまり目にしない画面かもしれませんが、新しくチームを作る時などによかったら見てみてください。
  • ## (追伸) [pplog.net](https://pplog.net/) について
  • こちらも、ヤッテイキマス ₍₍ ε=з ⁾⁾₍₍ ε=з ⁾⁾₍₍ ε=з ⁾⁾
  • <blockquote class="twitter-tweet"><p lang="ja" dir="ltr">先日発表された Twitter API の仕様変更・有料化に関連して、pplogの今後についてもご心配をおかけしております。今後もみなさまが使い続けることができるように、可能な限り対応していく予定です。<br>現時点ではTwitter側の変更の詳細がわからないため、来週以降の続報を受けて対応予定です。</p>&mdash; ポエム (@pplog_net) <a href="https://twitter.com/pplog_net/status/1621350091096485889?ref_src=twsrc%5Etfw">February 3, 2023</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
  • ---
  • [ProTip] [Webhookでdocs.esa.ioの更新通知を受け取ることができます](/posts/73)
  • Enjoy "(\\( ⁰⊖⁰)/)"
  • https://esa.io

今回のリリース内容

teams-new-renewal.png (3.1 MB)

新しくチームを作成するときの画面が、新しいデザインになりました。
esaを使い始めの一番最初に、チームを作る時の画面です。

デザイン改善ポイント

teams-new-renewal-design.png (2.0 MB)

この画面は、esaの利用を試してくださるユーザーさんが最初に目にする画面のため、より気軽にストレスなく新しいチームを作り、esaを使いはじめていただけるようなデザインを目指して、特に下記の点に配慮しデザインを変更しました。

  1. 入力項目をへらす; 「説明文」の入力欄を削除しました
    • チームについての説明文をそもそも必要としないケースも多そう
    • 任意の登録で十分なものは、できるだけ初期画面には載せない
    • (アイコン画像も任意登録だが、こちらは登録の有無が使い勝手を左右するので初期画面に含める)
  2. 文言をできる限り短く、具体的に、柔らかく
    • 例えば…
      • 「チーム情報は後からでも変更できます」→ 「アイコン」ラベル付近に「後からでも登録できます」という文言を配置
        • 後者の方が具体的な操作をイメージしやすく、文言も短くて済むので、ユーザーの負荷が低い
      • 「新規チーム作成」→「新しいチームを作成」
        • よりユーザー側の目線に沿った、柔らかい表現に
  3. センター揃えにして、メリハリのある見た目に
    • 目線の移動がなるべく少ない画面に
    • 重要なものは大きく、そうでないものは小さくメリハリをつけて見やすく

(\( ⁰⊖⁰)/) ヒトコト

新規チーム作成の画面は、普段あまり自分たちでも目にする機会が少なく、つい改善を忘れがちになってしまいました。また性質上、ユーザーさんからの直接のフィードバックもいただきづらい場所というのが、さらに改善を後回しにしてしまう要因になっており、サービス初期の古いデザインを残してしまっておりました :cold_sweat:
しかし、新しいユーザーからの第一印象を左右する画面なので、本来はきれいにわかりやすくしておきたい場所です。
既に普段 esa を使ってくださってる方は、あまり目にしない画面かもしれませんが、新しくチームを作る時などによかったら見てみてください。

(追伸) pplog.net について

こちらも、ヤッテイキマス ₍₍ ε=з ⁾⁾₍₍ ε=з ⁾⁾₍₍ ε=з ⁾⁾


[ProTip] Webhookでdocs.esa.ioの更新通知を受け取ることができます

Enjoy "(\( ⁰⊖⁰)/)"
https://esa.io

# 今回のリリース内容

<img width="2400" alt="teams-new-renewal.png (3.1 MB)" src="https://img.esa.io/uploads/production/attachments/105/2023/02/02/2/dfe8d029-5b7e-4bd5-85d4-cacf17e5587b.png">

新しくチームを作成するときの画面が、新しいデザインになりました。
esaを使い始めの一番最初に、チームを作る時の画面です。

## デザイン改善ポイント

<img width="2400" alt="teams-new-renewal-design.png (2.0 MB)" src="https://img.esa.io/uploads/production/attachments/105/2023/02/01/2/a0ab41d5-dd91-4c3a-ac4b-6f022feeb67a.png">

この画面は、esaの利用を試してくださるユーザーさんが最初に目にする画面のため、より気軽にストレスなく新しいチームを作り、esaを使いはじめていただけるようなデザインを目指して、特に下記の点に配慮しデザインを変更しました。

1. 入力項目をへらす; 「説明文」の入力欄を削除しました
    - チームについての説明文をそもそも必要としないケースも多そう
    - 任意の登録で十分なものは、できるだけ初期画面には載せない
    - (アイコン画像も任意登録だが、こちらは登録の有無が使い勝手を左右するので初期画面に含める)
1. 文言をできる限り短く、具体的に、柔らかく
    - 例えば…
        - 「チーム情報は後からでも変更できます」→ 「アイコン」ラベル付近に「後からでも登録できます」という文言を配置
            - 後者の方が具体的な操作をイメージしやすく、文言も短くて済むので、ユーザーの負荷が低い
        - 「新規チーム作成」→「新しいチームを作成」
            - よりユーザー側の目線に沿った、柔らかい表現に
1. センター揃えにして、メリハリのある見た目に
    - 目線の移動がなるべく少ない画面に
    - 重要なものは大きく、そうでないものは小さくメリハリをつけて見やすく


# (\\( ⁰⊖⁰)/) ヒトコト

新規チーム作成の画面は、普段あまり自分たちでも目にする機会が少なく、つい改善を忘れがちになってしまいました。また性質上、ユーザーさんからの直接のフィードバックもいただきづらい場所というのが、さらに改善を後回しにしてしまう要因になっており、サービス初期の古いデザインを残してしまっておりました :cold_sweat: 
しかし、新しいユーザーからの第一印象を左右する画面なので、本来はきれいにわかりやすくしておきたい場所です。
既に普段 esa を使ってくださってる方は、あまり目にしない画面かもしれませんが、新しくチームを作る時などによかったら見てみてください。

## (追伸) [pplog.net](https://pplog.net/) について

こちらも、ヤッテイキマス ₍₍ ε=з ⁾⁾₍₍ ε=з ⁾⁾₍₍ ε=з ⁾⁾

<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">先日発表された Twitter API の仕様変更・有料化に関連して、pplogの今後についてもご心配をおかけしております。今後もみなさまが使い続けることができるように、可能な限り対応していく予定です。<br>現時点ではTwitter側の変更の詳細がわからないため、来週以降の続報を受けて対応予定です。</p>&mdash; ポエム (@pplog_net) <a href="https://twitter.com/pplog_net/status/1621350091096485889?ref_src=twsrc%5Etfw">February 3, 2023</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

---
[ProTip] [Webhookでdocs.esa.ioの更新通知を受け取ることができます](/posts/73) 

Enjoy "(\\( ⁰⊖⁰)/)"
https://esa.io

今回のリリース内容

teams-new-renewal.png (3.1 MB)

新しくチームを作成するときの画面が、新しいデザインになりました。
esaを使い始めの一番最初に、チームを作る時の画面です。

デザイン改善ポイント

teams-new-renewal-design.png (2.0 MB)

この画面は、esaの利用を試してくださるユーザーさんが最初に目にする画面のため、より気軽にストレスなく新しいチームを作り、esaを使いはじめていただけるようなデザインを目指して、特に下記の点に配慮しデザインを変更しました。

  1. 入力項目をへらす; 「説明文」の入力欄を削除しました
    • チームについての説明文をそもそも必要としないケースも多そう
    • 任意の登録で十分なものは、できるだけ初期画面には載せない
    • (アイコン画像も任意登録だが、こちらは登録の有無が使い勝手を左右するので初期画面に含める)
  2. 文言をできる限り短く、具体的に、柔らかく
    • 例えば…
      • 「チーム情報は後からでも変更できます」→ 「アイコン」ラベル付近に「後からでも登録できます」という文言を配置
        • 後者の方が具体的な操作をイメージしやすく、文言も短くて済むので、ユーザーの負荷が低い
      • 「新規チーム作成」→「新しいチームを作成」
        • よりユーザー側の目線に沿った、柔らかい表現に
  3. センター揃えにして、メリハリのある見た目に
    • 目線の移動がなるべく少ない画面に
    • 重要なものは大きく、そうでないものは小さくメリハリをつけて見やすく

(\( ⁰⊖⁰)/) ヒトコト

新規チーム作成の画面は、普段あまり自分たちでも目にする機会が少なく、つい改善を忘れがちになってしまいました。また性質上、ユーザーさんからの直接のフィードバックもいただきづらい場所というのが、さらに改善を後回しにしてしまう要因になっており、サービス初期の古いデザインを残してしまっておりました :cold_sweat:
しかし、新しいユーザーからの第一印象を左右する画面なので、本来はきれいにわかりやすくしておきたい場所です。
既に普段 esa を使ってくださってる方は、あまり目にしない画面かもしれませんが、新しくチームを作る時などによかったら見てみてください。

(追伸) pplog.net について

こちらも、ヤッテイキマス ₍₍ ε=з ⁾⁾₍₍ ε=з ⁾⁾₍₍ ε=з ⁾⁾


[ProTip] Webhookでdocs.esa.ioの更新通知を受け取ることができます

Enjoy "(\( ⁰⊖⁰)/)"
https://esa.io