
グラスモーフィズム~すりガラスを通して覗いたような背景のぼかしが特長&デザインが素敵なサイト2つの備忘録 1/14 TechCommitもくもく部屋の日記
↑2021年1月13日に、ももさんから教わった【グラスモーフィズム】記事が気になりTechCommitにてシェアしました(*^-^*)
★記事より教わったこと。
NO1:【グラスモーフィズム】
【2020年末ごろより人気が高まっているスタイルで、静かな不発トレンドとなったニューモーフィズムのプラスチックな質感に対して、すりガラスを通して覗いたような背景のぼかしが特長です】
NO2:【Glassmorphism CSS Generator】
TechCommitで私の尊敬する先輩メンバーさんosiroさんに、助けていただいたことを綴りますね。(※デザイン学習の為引用いたします。)
【①グラスモーフィズム、初めて見ましたが、スマホやタブレットのUIの文脈で考えるとわかりやすいと思います。
(個人的な解釈です。ちゃんと調べたりもしてないので間違ってることもあると思います。)
スマホ以降のざっくりとしたのデザインの方向性として、「装飾を減らしたミニマルな方向性(フラットデザインと呼ばれるようなもの)」と「現実世界のもののように質感や陰影を付けた方向性(スキューモーフィズムと呼ばれたりする)」の2つの軸ができました。
フラットなデザインは、見た目がスッキリしていて、必要な情報にたどり着きやすいUIになります。
質感のあるデザインは、現実世界で触るものに似ているので、感覚的に操作しやすいUIになります。
ただ、両者は装飾を減らすものと増やすものとで矛盾が生まれます。
なので、それらの間で丁度いいデザイン(見やすくて、操作が直感的にわかる質感の装飾を持っている)として、ニューモーフィズムというものが出てきました。スマホやタブレットなどを前提に開発されたものなので、新しいデザインになり、オシャレにも見えやすいです。
ニューモーフィズムはフラットデザインをベースに陰影によって凹凸感を出すことで、矛盾を解消しようとした試みだと思います。
おそらくグラスモーフィズムはその発展形で、陰影に加えてすりガラスの透明なものを設けることで、凹凸だけではなく、「階層」があることも見えるようにして、新しいスタイルを作ろうとしたものではないかなと思いました。
個人的には、デザインする際にはある程度見たことのあるようなUIにしたほうが違和感なく使えることが多いと思っていて、ニューモーフィズムやグラスモーフィズムを使ったUIのアプリは触れる機会が殆どないので、無理にそれらのデザインを取り込む必要もないかなーと思っています。
テクノロジーを生かした、今っぽい新しい感じを前面に出したい場合に、これらのデザインの利用が選択肢に入ってくるかなーと
。
また、ここらへんの議論を踏まえた概念としては、「マテリアルデザイン」という言葉で追ってみると、丁寧に構築された話を終えると思います。
グラスモーフィズムなどは多分、使いやすさよりも、オシャレさ、新しさに重心を置いているように見えるので。
②ニューモーフィズムはおそらく陰影を強調するために白いものが多い感じだったけれど、色を使っても成立する方法としてグラスモーフィズムが出てきたところもあるかも。】
以上です。
【TechCommitオススメのデザインが素敵なサイト❤】
↑TechCommitでデザインが素敵なwebサイトについて、井上慎也さんから教わりました♪
【私のスキ❤】
↑私が一番、素敵だと思うデザインのサイト【華】の書道教室(※円山にあります♪)
綺麗な模様の着物で、書道学習なんて素敵ですね(#^^#)
おわり