SHEET K-49-U04
UIの
すりガラスのナビ
写真の
01動く
見て、動かして 確かめる。
項目を
押してみてください。
Simon Goellner
許諾文(MIT)を見る
MIT License Copyright (c) 2025 Simon Goellner (https://codepen.io/simeydotme/pen/qEBmggz) Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
02この
押すたびに、気持ちよく 返る。
押すたびに、
返事が ある 光の
粒が はじけ、 白い 丸が 弾むように 広がる。 押したことが、 目と 気持ちの 両方にはっきり 返る。 いま
どこに いるかが 分かる 選んだ
項目だけを 白い 丸が 包み、 文字の 色が 反転する。 小さな 画面でも、 選んでいる 項目を 見失わない。 写真を
隠さない 板は
すりガラスのように 透け、 細かな ざら つきで 質感を 出す。 写真や 映像の 上に 置いても、 背景を 殺さない。 軽く
作れる 粒は
15個だけで、 出たら 消える。 ねばる 動きは、 ぼかしと 濃さの 調整で 作っていて、 重い 仕組みを 使っていない。
03向いている
こんな場面に 向いて います。
- 写真や
映像が 主役の トップ画面の メニュー - 切り替えの
少ない タブ (2〜 4つ) - ブランドの
印象を 強く 残したい サイト - アプリのような
手触りを 出したい ページ
