ダイアログのキャンセル

製作中のアプリで、数カ所ダイアログを使う場面があって考えたこと。

デフォルトにキャンセル機能がない

時刻を設定するためのダイアログとしてAndroidにはTimePickerDialogが用意されているが、デフォルトではキャンセル機能が無い。というより、キャンセル（と思われる操作）時も時刻を設定する処理（onTimeSetメソッド）が呼ばれる。そもそもキャンセルボタンは無いし、ダイアログの外側をタップした場合はダイアログが閉じてonTimeSetメソッドが呼ばれてしまう。ここはキャンセルされてほしい。

OKは１種類

時刻を設定する場合は、OKボタンとか完了ボタンを用意して、それが押された場合のみ時刻設定されるべきだと思う。つまりその他の操作（戻るボタン、キャンセルボタン、ダイアログ外をタップなど）をした場合はキャンセルになるのが望ましいと思う。
一般的かどうかは調査していないので何とも言えないが、僕はダイアログの外側をタップした場合はただダイアログが閉じてキャンセルされる経験を多くしているので、当然そうなると思っている。もちろん何も起きないということもあるが、OKボタンを押した場合と同じ処理が走るとは思わないし、操作自体が怖くなってしまいかねない。

余談：ダイアログのタイトル

設定画面等で、複数の時刻を設定する場合など、同じような項目が並ぶことがある。その場合にダイアログを表示した場合、どの項目かを判断できるようにしておく必要がある。その時の文脈でわかるかもしれないが、一応思ったのでメモっとく。

ActionBarとToolBar

ActionBarの実装方法を時らべていると、少し前のAndroidアプリであればActionBarを実装するのが定石らしかった。最近はマテリアルデザインに寄せるためにToolBarを使用するケースが主流なんだろうか。初めはActionBarで実装していたが、UIデザインをマテリアルデザインに合わせて作っており、ToolBarの方が実装しやすかったので切り替えた。

ActionBarが一般化したToolBar

Android5.0以降でないと使えないと思っていたが、サポートライブラリが出ていたので従来のバージョンでも実装可能。
画面上部に配置されるActionBarに対し、ToolBarは配置を限定されていないらしい（実装してないので確証はない）。ActionBarは他のViewと異なりxmlでレイアウトを調整できないが、ToolBarではxmlで調整する。まだ細く調べていないが、一般的なActionBarとやりたいことが異なれば、ToolBarを使うと楽だと思う。

ナビゲーションボタン

iOSでもAndroidでも、画面遷移した後に前の画面へ戻るボタンが左上に表示される。Androidの場合はハード、もしくはソフトウェアボタンに戻るボタンがあるが、左上に表示することも可能。ActionBarを実装した場合、アプリアイコンの左側のかなり小さいスペースに戻るアイコンが表示され、アプリアイコンを含めた領域が戻るボタンと化す。
ToolBarを実装すると、ActionBarではアプリアイコンを表示していた位置にナビゲーション用のボタンを配置するようになる。戻るボタンやメニューボタン（いわゆるハンバーガーボタン）など。そのため、以前に比べかなり大きく戻るボタンが表示される（単純にタップ領域が大きくなったわけではない）。

Android で線とか描画

CSSのborderをAndroidでできないかと思って、調べてたら描けた。２つのやり方を試したのでそれを書く。

1dpのView

1dpの線を引くための方法としてイメージしやすいのは、1dpのViewを作成して、backgroundで色を指定する方法。

<View
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:background="#DDD" />

あとはこれをRelativeLayoutとかで入れたい位置に入れるだけ。この方法なら、例えば下線だけ入れたいって時には楽だと思う。

shapeやstrokeを使う

1本の線だけでなく、枠線を作りたいっていう時とかは以下の方法を使った。

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="#CCC"/>
    <stroke
        android:width="3dp"
        android:color="#AAAAAA"
        android:dashGap="3dp"
        android:dashWidth="3dp"
        />
    <padding android:left="3px" android:top="3px"
        android:right="3px" android:bottom="3px" />
    <corners android:radius="2px" />
</shape>

画像（ImageView）のまわりに枠線を描こうと思って作ったやつ。上記は破線の四角形が描ける。paddingも効くので良い。

行（アイテム）追加のインタフェース

薬の服用時間をアラートしてくれるアプリを製作中で、デザインも実装も自分でやっており、実装は何とかなるものの、デザインの考え方が慣れていないので難しい。今日はアプリで必要になった機能、行（アイテム）の追加のUIについて。

同じ薬でも服用タイミングが異なる場合がある

僕が薬を服用する場合は、大抵が風邪かインフルなどの季節性の病気。この場合、薬の服用期間は大体3日〜１週間くらいだと思う。朝・昼・晩の３食後に飲む場合が多いのかなという印象。だから基本的に１つの薬を服用するタイミングは1日３回とか寝る前とかかなと思っていた。
よくよく聞いてみると、中には「週２回、日曜の夜と月曜の朝」というタイミングで服用しなければならない薬もあるとのこと。お年寄りの方で、たくさん薬を飲んでいる方もいるけど、もしかしたらいろいろ複雑な飲み方をされているのかもしれない。

１つの薬に複数の服用タイミングが必要

当初は「薬Aは毎日、朝・昼・晩」とか「薬Bは週１回日曜日、寝る前」とかを想定していた。今回考える必要があるケースは「薬Cは週２回、日曜日の夜、月曜日の朝」というもの。曜日（もしくは毎日）と時間（朝・昼・晩）が１セットなので、薬Cの場合は２セット必要になると考えた。そこで、２セット以上設定できるようなUIを考える。

アラート設定画面のレイアウト

上記服用タイミングを設定する画面を用意する。ブログ用にデザインはざっくり作ったので適当です。
「服用設定」より下でタイミングの設定をする。曜日と時間帯を選択するだが、ここを複数個設定できるようにする必要がある。自分の解としては、最低１つは登録してもらう必要があるので、リストの一番上はデフォルトで表示。さらに、３段目のプラスアイコンから始まる行もデフォルトで表示しておき、複数設定が可能なことを示している。ここでプラスアイコンをタップして２個以上設定しようとした場合、リスト２段目のように左端に削除用のアイコンを置いておく。このように追加と削除を行えるようにした。

「保存」ボタンを上に配置

服用タイミングの設定数が少ないことを想定していた当初は、画面下部に保存ボタンを配置する予定でした。しかし複数設定できる以上、画面下部にボタンを配置するのは良くないかなと思い（画面が長くなるのと、戻る・ホームボタンなどを誤タップしてしまうのではないかと思い）、アクションバーに保存ボタンを、その隣にキャンセルボタンを配置しています。

「追加」と「削除」のアイコン

この画面のタイトルにもあるが、「新規作成」というからには、前の画面で何かしら作成を促すアイコンをタップして遷移させている。プラスの記号を使ったシンプルなアイコンを使用する予定だが、それではこの画面内のプラスアイコンと被ってしまう。これは少し変える必要があると思う。
また削除のアイコンは、この画面ではバツ印を使用している。しかし、バツ= 削除というのもしっくり来ない。ゴミ箱アイコンやマイナスアイコンを考えたが、素直に伝わるかは使ってもらってみないと分からない。

単純なアプリでも考えること多い

デザインの経験が少ないせいでもあるのでしょうが、考えるべき点が多いなと感じる。いろいろ気にしてしまうこともあるが、とにかくざっと作って、誰かに使ってもらってフィードバックをもらって修正して、というのを繰り返すのも大事だろう。

公式の Android UI デザインテンプレート

ステータスバーやアクションバーの高さってどれくらいだっけ、と思って公式サイトを眺めていたら、UIのテンプレートが用意されていた。てっきり文書で用意されていると思っていたので、とてもありがたい。

ダウンロードサイト

初心者にはとても助かる

ダウンロードできるファイルがAIファイルなので、Illustratorでそのまま開いて使用している。簡単なアプリであれば、このテンプレをそのまま使ってしまったほうが綺麗なレイアウトになるんじゃないかと思う。

ものさしツールでいろいろ計ってみる

Illustratorに慣れていないので効率的かどうか分からないけれど、マージンなどをものさしツールで計りながら構造を見てみた。アクションバーのアイコンの大きさや間隔、リストのアイテムのマージンなどを図っていると、なんとなく見えてくる。

間隔を意識してみる

せっかくなので間隔や大きさを意識してみることにした。画面の左右端のマージンを16pxとした場合、大体これを基準にマージンや大きさを揃えていく。例えばリストアイテムのアイコンと本文のマージンを16px（16px × 1）にしたり、リストのセクションバーの高さを48px（16px × 3）にするなど。デザイン経験も浅いのでこういうことから始めてみる。

デザインパターンサイトも参考にする

テンプレート通りにワイヤーフレームを作成したら、見た目はデザインパターンサイトを参考にしている。余裕があればこれらもものさしツール等でいろいろ計ってみたい。

アドラー心理学について

岸見一郎さん、古賀史健さんの著書「嫌われる勇気」を読了。読みやすい構成で内容もとても面白かった。本書ではアドラー心理学に基づき、人はだれでも幸せになれるということを説いている。アドラーの考えに初めて触れ面白いと感じた点を残しておく。

目的論

「ああしたからこうなったんだ」と考える原因論に対し、アドラー心理学では「こういう目的のためにああした（している）」という目的論で語られている。目的に着目する点が面白いと思い、同時に自分では気づきにくい視点だなと思った。
まだ理解しきれていないけれど、例えば自分の性格。飽きっぽい性格をしている。いろいろちょっとずつ手を出しているような感じ。広く浅くといえば聞こえはいいが、これを目的論で言えば、本気でやればなんとかなるという可能性を残しておきたい（という目的がある）のかもしれない。
昨今、学校でいじめられていた学生が自殺するというニュースをたまに目にする。被害者はなぜ自殺をしなければならなかったのか、反対に加害者はなぜいじめる必要があったのか。被害者と加害者の他に、傍観者もいただろうし、被害者を助けようとした人もいたかもしれない。それぞれの目的もなんだったんだろうか。個人的には今まであまり意識していなかった視点だなと思う。

課題の分離

誰かが自分のことを嫌いになる可能性は十分にあるが、それはその誰かが決めることであり、自分が決めることはできないし考えたりすべきではない。誰のタスクなのかを明らかにし、自分のタスクにのみ注力する。
また、他人への介入もアドラー心理学では否定されている。親が子供に命令する例があったが、例えば学校での先生と生徒、先輩後輩という上下関係の間にももちろんあるだろうし、友人という対等な関係の中でもありうる。僕はあまり他人に介入していないが（気づいていないだけかもしれないが）、援助することはある。無責任なことを言っちゃいけないと思って慎重に言葉を選ぶこともあったが、少し意識を変えてみようと思う。何かを選択し実行するのは当人であり、結果に関しては相談に乗った人や助言した人に責任は無いと考える。ただし、結果的にどうなったかは知っておくべきで、その人のことを見ておくべきなのだろう。

他者貢献

言葉通り他者に貢献することが幸福を感じるために必要。ただし、貢献したことを他者に承認してもらうのではなく、自分で貢献したと思えることが大事。
アドラー心理学では承認欲求は否定されていて、他者に承認を得る必要があれば、それは他者に依存した生きづらさを選択していることになる。承認ではなく貢献感を感じる例として「ありがとう」と言われること。この言葉に上下関係はなく、かつ承認されているわけでもない。
他者貢献を感じるためには、「共同体感覚」を得なければならず、 それには今の自分をありのまま受け入れる「自己受容」と、無条件に他者を信頼する「他者信頼」が必要。自分はここにいて良いんだ、と思える場でなければ貢献感は持てないということ。

すこしまわりを見る目が変わったように思う

理解するのに時間がかかると言われているアドラー心理学。それを少しかじっただけでも、自己受容を頑張ってみようかなと思ってみたり、課題の分離を意識してみようと思える。少しずつ理解していければと思っている。

グッドデザイン賞展を見てきた

グッドデザイン賞展2015を見に行ってきた。 情報機器のデザイン（GUI含む）を見ようと思っていたのだけれど、他にも面白いデザインが多かった。さらに、自分のアイデア出しの視点をちょっと変えてみようとも思ったのでメモしておく。

全体的に感じたこと

グッドデザイン賞を受賞したものを多く見る機会は今回が初めてだったこともあり、新鮮だった。IT関連を中心に見ていたが、これまでに無い新しいユーザ・インタフェースや、家具をスマホやスマートウォッチで操作する系が気になった。 他の展示会でも見る機会はあったと思うが、例えば車内の機器デザインはこれからもっと先進的になっていく。自動運転と合わされば車内での体験がどのように変わるのかなど、先のデザインを思わせるようなものもありワクワクした。 家具をスマホ等で操作するデザインは普及していきそうだなと感じた。意外とスマホは家の中でも持ち歩いている。一人暮らしでは少ない可能性はあるが、一軒家で生活していればスマホの移動量も多くなると思う。常に自分がいる場所からあらゆる家具を操作できるというのは体験してみたい。

アイデアを発散させるポイント

大学時代に友人とアイデアコンテスト的なものに出たことがある。そのとき考えたのが、自転車の車輪部分にLEDを付けて、回転させることでそこに文字や絵を表示させるというもの。 回転させたり振ったりすることにより文字や絵を表示するものは多くあるが、グッドデザイン賞で見たものは、縄跳びの回数を目の前に表示するというもの。回転に合わせて表示される。 これを見て、コンテストのアイデアを考えていた時に、同じ回転させるものでアイデアを発散させてなかったなと思い返した。 当時は「これ面白いじゃん！」といってすぐに収束させていたので、少し発散させるためにポイントを絞って考えてみることも大事だったなと思った。このアイデアを他に使えないか、と考えてみることにする。