どもです。こすげでーす。
さてとりあえず告知させてください。
ブログを見てくれればわかると思いますが(右側みてみ)
Androidアプリリリースしました!
ゆーてダイナシユーザー専用的なところがありますが...。
数少ない読者のみなさま、これを機にダイナシ、使ってみてください。
そしてUIとかこんなことしたいとかありましたら
コメントでも、Twitterアカウントへでもいいので、文句言ってください。
すぐ自分から返事させて頂きます!!
ちなみに現状はiPhone用をツクル予定はないです...。
iPhoneユーザーさん、ごめんなさい。
という告知も終わり、今日はどんなコト調べて書こうかなーと考えて一つ思いついたことが。
※思ってた以上に長くなってしまったので、分けました。よかったら読んでくださいませ。
どもー。こすげっすー。
やって参りました。月曜日。
憂鬱な月曜日。
なんてものは俺にはない。
UIとかみなさん、どのように考えていますか?
ちょー有名なサイトをcopyしますか?
それともオリジナルを押して世に新たなstandardを広めていきますか?
自分はどちらかというとcopy派です。
ただ自分で組み立てるわけではありません。
やっぱどうしてここにこのボタンを置いたのか。
どうしてこのpageのURLをこれにしたのか。
全てにreasonがなければいけません。
そしてこの前androidのアプリをひとつ作りました。
既存userさん向けではありますが、いろんなアプリのUIを拝見させて頂きました。
そしてひたすらこだわりを持って作成しました。
明日リリースしまっす。(maybe)
UIって作ってる側は全てのデザイン(colorとかstyleとかposition ..etc)に対してreasonがなければならないですが、
使ってる側はその意図を汲み取るnecesarryはないと思います。
使う側が言うのは
「使いやすいか使いづらいか」
で使いづらいというのは違和感なわけで、
自分の作ったandroidアプリがworldを切り開くわけではないんですよ。
むしろ、既に出来上がってる場所に突っ込んでいくので、
ルールとかお決まり、習慣的なのを知っておく必要があります。
じゃないと使いづらいの一言で自分の中で画期的だと思った機能を十分使われないまま
uninstallされてしまいます。
Gunosyが注目されている理由に独自アリゴリズムでニュースをお送りしますとか新しい"機能"を提供している傍ら、デザインはUIは至ってシンプルだと思います。
だから機能のお話で盛り上がってます。
我々プログラマーにとって、作ったものの機能に評価をもらえるコトはとっても嬉しいことです。
ただ、そこのphaseに行くまでにUIという壁があるというコトを意識しなければなりません。
simple is best
大好きなwordですが、でもそこに自分の色みたいなものを入れていきたい年頃です。
はい。
という感じで明日色々リリースが控えているので、今日はここらへんで。
ども。こすげっす!!
ついに始まりましたね!!!
いやーやっぱ面白いっす!!
確かに残念だったけども、面白かった!
え?なにがって??
コンフェデレーションズカップに決まってるじゃん!
ブラジル強すぎ。てかみんなウマすぎ。
トラップしかり、パスしかり。
日本とはそこの差が一番だったんじゃないですかねー。
まあ2日連続でサッカーネタ書くとサッカーバカみたいに思われちゃうので、
今回は今やってる
Androidアプリ
のお話。
※アンドロイドってなんとなくなんだけど、赤のイメージないっすか??
ちなみにiOSはシルバー的な...。俺だけ??
えー現在androidアプリを作成してます。
ちなみにUIとかもやってます。
こういうの気になり始めたら私止まらない性格でして...。
なれないデザインに手をつけはじめてます。
まあxmlでやるのにもだいぶ慣れまして、eclipseさんともだいぶお近づきになれたかなと...。
UIに関してはこちらのサイトを参考にしてます!!!
Android Application Design Acheve
http://dorodoro.info/aada/
アプリのUI集ですね。
こういうの眺めてるだけで幸せになれます...。
できればこういう書き方するんだよ的なアレも欲しかったですが、そこは我慢。。。
でですよ。
前に作ったサービスのアプリを開発しているのですが、デザインはサービスに準じたほうが
ユーザーも使いやすいと思うんですよねー。
で、一番色がでるのが、ボタンなのかなと。
あとはテキストね。
ってことで、デザイナーさんに主要の色を教わり、自分で作成しました!
カラーの参考にしたサイトは以下!!
Color Scheme Designer 3
http://colorschemedesigner.com/
ここに特定の色のカラーコードを入力すると
近しい色を教えてくれます!!
そうとう助かりました!
これやべーっすよ!
てな感じで最後にandroidのボタンのデザインの仕方でも...
※androidなんで赤系でねww
まずは res/values/直下に例にならってstyle.xmlを作成します!
そして下記コードを...
<style name="button_red" parent="@android:style/Widget.Button">
<item name="android:background">@drawable/button_red_style</item>
</style>
<item name="android:background">@drawable/button_red_style</item>
# res/drawable/button_red_style.xml
<!--?xml version="1.0" encoding="utf-8"?-->
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/button_red_default" android:state_enabled="true" android:state_window_focused="false"></item>
<item android:drawable="@drawable/button_red_enabled" android:state_enabled="false" android:state_window_focused="false"></item>
<item android:drawable="@drawable/button_red_enabled" android:state_enabled="false"></item>
<item android:drawable="@drawable/button_red_pressed" android:state_pressed="true"></item>
<item android:drawable="@drawable/button_red_pressed" android:state_enabled="true" android:state_focused="true"></item>
<item android:drawable="@drawable/button_red_default" android:state_enabled="true"></item>
<item android:drawable="@drawable/button_red_focused" android:state_focused="true"></item>
<item android:drawable="@drawable/button_red_default"></item>
</selector>
# res/drawable/button_red_default.xml
<!--?xml version="1.0" encoding="utf-8"?-->
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<padding
android:bottom="10dp"
android:left="10dp"
android:right="10dp"
android:top="10dp" />
<corners android:radius="0dp"></corners>
<gradient
android:angle="270"
android:startColor="#E51600"
android:endColor="#950E00"
android:type="linear" />
<stroke
android:width="1dp"
android:color="#950E00" />
</shape>
# res/drawable/button_red_enabled.xml
<!--?xml version="1.0" encoding="utf-8"?-->
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<padding
android:bottom="10dp"
android:left="10dp"
android:right="10dp"
android:top="10dp" />
<corners android:radius="0dp"></corners>
<gradient
android:angle="270"
android:startColor="#610900"
android:endColor="#3F0600"
android:type="linear" />
<stroke
android:width="1dp"
android:color="#3F0600" />
</shape>
#res/drawable/button_red_focused.xml
<!--?xml version="1.0" encoding="utf-8"?-->
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<padding
android:bottom="10dp"
android:left="10dp"
android:right="10dp"
android:top="10dp" />
<corners android:radius="0dp"></corners>
<gradient
android:angle="270"
android:startColor="#F24E3D"
android:endColor="#F27A6D"
android:type="linear" />
<stroke
android:width="1dp"
android:color="#950E00" />
</shape>
# res/drawable/button_red_pressed.xml
<!--?xml version="1.0" encoding="utf-8"?-->
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<padding
android:bottom="10dp"
android:left="10dp"
android:right="10dp"
android:top="10dp" />
<corners android:radius="0dp"></corners>
<gradient
android:angle="270"
android:startColor="#F24E3D"
android:endColor="#F27A6D"
android:type="linear" />
<stroke
android:width="1dp"
android:color="#950E00" />
</shape>
<button
style="@style/button_blue"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />