見出し画像

【ほぼ日報。】 vol.04 | 2019.6.28（金）

てまり


※ 6/29（土）投稿ですが、内容は6/28（金）です。


今日やったこと

ボタン画像作成


ECサイトの「『カートの中身を確認する』ボタンを追加してほしい」との変更依頼。ページ変移するボタンが画像だったので作成した。
（なぜ今まで付けていなかった…）

「カートに入れる」ボタンと違う色で作成してディレクターに見せたら、

「『購入する』ボタンと一緒でいいのに〜、サイトの色ごちゃごちゃにならない？」と言われてしまったので、

「いや、ボタンの意味合いが全然違うので、購入ボタンとは色変えた方がいいと思います」

と伝えた。でも腑に落ちない顔。


ノンデザイナーのディレクターに、デザイン理論を伝えて納得してもらいたい場面が多々あるけどなかなかできずもどかしい。

「ユーザーはこう思いますよ」「ユーザーはこう操作しますよ」って言えれば強そうだけど咄嗟に出てこなくて悔しい…！

全然デザインの言語化ができないんだな〜と自覚しました。



メインビジュアル修正


メインビジュアルから下層ページに飛べるようにしてほしいとの修正依頼がきたので、クリッカブルなことをアピールするために画像内にボタンを設置。

いつもボタンの中身のテキストを何にすべきか悩んでしまう。

「〇〇（リンク先のページ名）はこちら」？
「詳細はこちら」？
でもTwitterで「『詳細はこちら』ってまだ使ってるサイトあるのか…」ってみたことあるし…。

ユーザーが「このボタンを押すとどうなるか」を想定しやすいテキストにしなければならないのは重々承知しているけれど、実際に作るとなるとどんな文が適しているのかがわからなくなる。


3週間ほど前、「特急あずさの新システムが使いづらい話」というテーマで図解をした。

3枚目で「ユーザーにとってほしい行動を明記することで、ユーザーは理解しやすくなる」という主張をしたにも関わらず、いざ実践するとなると全然できないもんだな〜と。


いくら頭でわかっていても、実際に手を動かさないと本当に理解したとは言えない

というのを、実際に手を動かしてみて本当に理解しました。


結局ボタンは「〇〇（リンク先のページ名）はこちら」の形にしました。


-----------------------------------


ボタンのテキストみんな何にしてるのかな〜と思って軽く調べてみたら、「〇〇はこちら」とかもあったけれど、

「〇〇（リンク先のページ名）を見る」

という風に動詞を使うのが多かった。


最も押してほしいボタンは「〇〇を見る」、それ以外は「〇〇はこちら」
（写真：株式会社ビズリーチ　https://bizreach.co.jp/）


「お問い合わせする」「ダウンロードする」というように、「〇〇する」が対比して使われている。

ウィンドウ下部にある追従ボタン（重なったフキダシアイコンが使われているボタン）のほうで「〇〇する」ではなく「〇〇はこちら」が使われているのは、ユーザーに押し付けがましい印象を与えないようにするため？
「ご相談・お問い合わせしたければこちらからできますよ〜」と、ユーザーに行動を委ねようとしているのかも。

（写真：株式会社ベイジ　https://baigie.me/）


ボタンに動詞を使うのがわかりやすくて良さそうだけど、使い分けることでユーザーに違う印象を与えられそうです。


テキストには言及してないですが、ボタンデザインの仕方参考サイト。わかりやすい〜！

UIデザインを紐解く。これだけは押さえたいボタンデザインのポイント | 東京上野のWeb制作会社LIG
https://liginc.co.jp/280820



同じ部署の同僚が来月から異動でSEとして出向するんですが、それに向けての勉強会を他の先輩社員と和やかな雰囲気でやっていてとーーーっても羨ましい！わたしも社内勉強会したいです…。



【今日見たサイトざっくり紹介】

なぜか記録していなかったのでないです。


この記事が気に入ったらサポートをしてみませんか？