マガジンのカバー画像

seya's ほぼ Daily UI

70
運営しているクリエイター

#dailyUI

〜ほぼ Daily UI vol.63〜 Best of 2020

元のお題は2015だけど、あまり覚えてないので2020にした。 参考にしたサイト・アプリ The Game Awards ダイナミックなカルーセルでかっこいい。Discoverってスクロールサジェストもいい State of JS 特殊な見せ方。一位が何かとかランキングっていうより遷移に重きをおいてるからこんなグラフになっているのかも Dribbble 写真も相まってかっこよす。ワンアイテムバーンってやるのいいかも デザインを考える上でのポイント メインのグラフィック

〜ほぼ Daily UI vol.62〜 Workout of the Day

参考にしたサイト・アプリ デザインを考える上でのポイント 何をどのくらいやればいいのか分かりやすい 多分メディアとしては動画が一番望ましそう。誰でもわかるようなワークアウト(ジョギングとか腕立て伏せ)しかないのであれば、動画あってもむしろ邪魔だと思うので、ワークアウトの難易度で表現を変える。 どこまで終わったのかをトラックしやすくする ワークアウトが複数ある場合はどこまで終わったのかをOpacity下げたりチェックマークつけたりで分かりやすくする。 自分のデザイン フロー

〜ほぼ Daily UI vol.61〜 Redeem Coupon

Imagine that it's time for someone to redeem a coupon. It could be via an in person self-checkout screen or on a website. Think about the requirements of a coupon such as the discount percentage, the subtotal, total, and other unique featur

〜ほぼ Daily UI vol.60〜 Color Picker

参考にしたサイト・アプリ Google Color Picker 左に広い面積で色を確認できるのいいかも Figma figma.com htmlcolorcodes https://htmlcolorcodes.com/ デザインを考える上でのポイント 色相のスライダーと彩度と明度のpickerが一般的なUIっぽい 基本的にこの形なので、強い目的がない限りはこのUIを踏襲した方がいいっぽい。 色を選んだ後コピペして使いやすいようにする おそらくメインのユースケース

〜ほぼ Daily UI vol.59〜 Background Pattern

Hint: Design a boarding pass. Consider the origin, the destination, gates, seats, the airline, etc. (As always, it's up to you!) 参考にしたサイト・アプリ Goodpatch Blog https://goodpatch.com/blog バックグラウンドにアイコン敷き詰めるのかわいい メルカリ https://www.mercari.com

〜ほぼ Daily UI vol.58〜 Shopping Cart

参考にしたサイト・アプリ Nike https://www.nike.com/jp/ja/cart 合計の部分だけフォント違うけど何目的なんやろ Amazon https://www.amazon.co.jp/ref=navm_hdr_logo デザインを考える上でのポイント個数を選ぶUI 普通のプルダウンにするかこう言う感じのやつ 削除の位置 Amazonみたいにアイテム自体の情報の下にアクションを集めるパターン。個数表示で1からマイナスにするときはゴミ箱にすると言

〜ほぼ Daily UI vol.42〜 ToDo List

参考にしたサイト・アプリ Todoist https://todoist.com/app Google Todo 日付で分かれてるのいいアイデアかも。その日の内に終わらなかったら繰り越し表示とかならありか? デザインを考える上でのポイント すぐにTodoを足せる & 消せる 優先度的にはこれらのアクションが最高だと思うので、すぐに行えるような位置に配置する。具体的にはGoogle Todoみたいにナビゲーションの真ん中に追加ボタンを置くとか良さそう タスクが優先度ご