![見出し画像](https://assets.st-note.com/production/uploads/images/84804866/rectangle_large_type_2_9c11ba1e0b1c00ef61617b9572c1e0fa.png?width=1200)
【UIデザイン】ClubhouseのUIトレースをして学んだこと
こんばんは!今日はClubhouseのUIトレースをしました。
メイン画面
![画像1](https://assets.st-note.com/production/uploads/images/47267752/picture_pc_69a15cfd6eec475d90aea7ec9bdb0802.png?width=1200)
気づき
・メインで使われているカラーのなかで、目立つのは緑色のみ
・この画面で使われるフォントカラーは黒よりも少し薄い(柔らかい)#333333のカラー
不明点
・下のStart a roomのボタンの背面にBlurがかかっていたのですが、かけ方が分からなかった。
ルーム画面
![画像2](https://assets.st-note.com/production/uploads/images/47267865/picture_pc_f2ae2cfe9dfbcd67e13c3a1c1ae8e281.png?width=1200)
気づき
・ホーム画面からルームに入った時に左右の余白がなくなる→入室している感を出すため (?)
・名前のフォントカラーは黒を使用、テーマは先ほどと同じ#333333→名前の方を強調、"誰が"話しているかがより重要
・下のボタンについて
∟ 先ほどのページでは新しいルームを作るボタンが緑に対して、ここでは薄いグレー
→ 退出や手を挙げる行為はユーザーの判断に任せるため、あえて目立たない色にしたのかなと思った。
全体として
フォントが分からなかったので、他のフォントを使用しました。Figmaのフォントについてですが、選択するまでそのフォントがどういう字体か分からない (サンプルが出てこない) のがちょっと難しいな・・と。いい方法がないか探ってみます。
最後まで読んでいただきありがとうございました!!
この記事が気に入ったらサポートをしてみませんか?