見出し画像

〜ほぼ Daily UI vol.4〜 Calculator

電卓ですね。仕事ではデザインも実装することも私のキャリアではなさそうです。こういうのをデザインするのも Daily UI の醍醐味なのかもしれません。

参考にしたサイト・アプリ

iPhone の電卓
シンプルですね。ただ最上段の記号たちは何をやってくれるか見当がつきません。ちなみに % は mod  じゃなくて 100分の1にするという挙動でした。エンジニアに優しくないですね。

iOS の画像 (3)

Googleの検索結果
https://www.google.com/search?q=%E9%9B%BB%E5%8D%93&oq=%E9%9B%BB%E5%8D%93&aqs=chrome..69i57j0l7.3913j0j4&sourceid=chrome&ie=UTF-8

スクリーンショット 2020-04-29 0.16.12

Android?

スクリーンショット 2020-04-29 0.20.03

TI-89

https://www.amazon.co.jp/Texas-Instruments-Titanium-Calculator-%E3%80%90%E7%B1%B3%E5%9B%BD%E7%89%88%E3%80%91%E3%80%90%E4%B8%A6%E8%A1%8C%E8%BC%B8%E5%85%A5%E5%93%81%E3%80%91/dp/B0001EMLZ2

強そう。

画像4

デザインを考える上でのポイント

1. 一画面で完結させる
まあまずどの電卓を見ても思ったのが「このボタン何…?」と機能が分からないのがいくつかあるということだ。

リテラシーの低い私のような人間は完全に置いてけぼりである。まあでもそれより学習コストがかかること前提で一画面でタスクを遂行できることの方が重要なのだろう。

2. 数字や四則演算の並びはお作法があるっぽい
例えば四則演算は必ず上から「÷」「x」「-」「+」になっている。

こういう世界共通のお作法みたいなのは守った方がいいだろう。多分誰も意識していないだろうが、変えてしまうと違和感を与える恐れがある。

自分のデザイン

そのままだとあまり面白くないので、ちょっと遊び心を入れて某どうぶつの森を意識して海っぽくしてみた。けっこうかわいいのではなかろうか。

画像5

思ったこと

- 文字色と背景色の配色が思ったより難しい。今回無駄に貝とかを使ったせいでもあるのだが、背景に溶け込まないでちゃんと文字が読めるようにするのに意外と苦労した。彩度と明度、慣れもあるのだろうが学んでいこう


いいなと思ったら応援しよう!