初心者🔰のWebデザイン独学記録🐣✏️

その日の気づき・疑問点・進捗📝

#Day63 一旦検索ボックスとアイコンを。

#Day63

昨日のアドバイスで、アイコンが揃わないと一人で騒いでいたのは、ベースラインというそもそもの英字の性質によるモノということがわかった。😂

menuの”m”は合わせた!!

すごい時間かかってたけど理由がわかりスッキリ・・😂

 

検索ボックスはグレーのままだったのでアイコンと同じ色味に変更。

 

アイコンと同じ色味の検索ボックス

 

え?!なんか暗いかも。と思ったので

下の背景色に使ってるベージュに合わせた。

ベージュ検索ボタン

こっちの方が良さそう。

 

角を丸くしたかったのでそれも変更。

https://qiita.com/okalog/items/7aae36f023dedaf91dac

 

角の数値を10くらいだとあんまり柔らかさが出ないのと目立たなくて、20以上にすると下の商品画像は角が四角なので・・・統一感があまりにもなくなる気がして15にした。

 

前に参考にしていたディモアさんのサイトはボタンを丸角にしていて検索ボタンもまる角だからあんまり浮いてる感じがないのかな。

https://10mois.com/pages/babygift

と思って、自分も"and more Item"のボタンを急遽検索ボックスと同じ丸角に変更した。🤔

進捗

 

ファーストビューの文字の可能性を上げるために模索中。

可能性という言葉を初めて聞いたが他にもあって面白かった。

 

これまで読んだ参考サイトメモ

http://creator.dwango.co.jp/13693.html

https://wkwkdesign.com/text-readability-design-tips/

https://bindup.jp/camp/design/16692

 

https://www.figma.com/file/gfoImPAq636rIrkYg8v6EU/%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB?type=design&node-id=0%3A1&mode=design&t=YywlcgYsTofUrym0-1