ラベル アプリ の投稿を表示しています。 すべての投稿を表示
ラベル アプリ の投稿を表示しています。 すべての投稿を表示
2013/05/31

[書評]モバイルデザインパターン

モバイルデザインパターン― ユーザーインタフェースのためのパターン集
Theresa Neil
オライリージャパン
発売日:2012-09-24
ブクログでレビューを見る»
モバイルアプリデザインのベストプラクティスのカタログ本です。
実際のアプリのスクリーンショットを用いて
それぞれのデザインパターンについて説明しているので用途がイメージしやすいです。
アンチパターンについても書かれているので
開発したアプリがアンチパターンに陥っていないか確認するのに良いと思います。
基本的には良い本なんだけど私が嫌いなデザインの本にありがちな何点かの問題があるため☆5とは行かず。
  1. 説明とスクリーンショットがページをまたぐ。
  2. 説明の文末に対象の図番号を記述するので読み終わるまでどのSSについての説明なのかわからない。
  3. 実際の UI なのでその他のコンポーネントが多くてどの部分について説明しているのかわかりにくい。
  4. 実例を見ながらの説明なので説明文がなんとなくまとまっていない。
上記の4点のせいで何回も説明とスクリーンショットを見比べなければならないので頭に入って来にくかったけど
付録でデザインパターンと簡潔な説明がわかりやすく載っていたので良しとする。

デザインパターンの種類とスクリーンショットは以下のページにあります。
Mobile Design Pattern Gallery: UI Patterns for iOS, Android and More

他にもモバイルアプリデザインパターンを集めたサイトがたくさんあります。
Pttrns — Mobile User Interface Patterns
Mobile Patterns
MOBILE PATTERNS
Patterns of Designdiscovering the best in iOS app design
TapFancy – An iPhone app design showcase and gallery
TappGala: The Best in Mobile Interface Design
Android App Patterns
Tumblrにスクリーンショットがたくさんアップされているので参考フォローしておくのもいいかもしれません。
lovely ui
Well-Placed Pixels
Android niceties
以下のサイトは Android アプリの挙動のパターンを解説していて Android を使わない人に便利かな。
Android Interaction Design Patterns |

デザインパターンも大事だけどまずはデザインガイドラインを知ることから始めないといけませんね。
Design | Android Developers
Icon Design Guidelines | Android Developers
iOSヒューマンインターフェイスガイドライン(pdf)
iOS Human Interface Guidelines: Introduction
2012/09/21

Lita - GUI の SQLite クライアントアプリケーション

Lita - SQLite Administration Tool
Lita is a free and open source SQLite database administration tool for Windows, MacOSX and Linux.
  • Open, create, compact, manage SQLite databases
  • Create, rename, delete, and empty tables
  • Create, rename and delete columns
  • Create, modify and delete records
  • Encrypt or reencrypt your databases
  • Run, import and export your custom SQL statements
  • Create and delete indices

SQLiteでできるほとんどのことができると思われます。
Android や iOS ではデータベースは SQLite を利用しているので SQL のテストをしたい際に便利です。

Android なら端末の以下のパスに .db ファイルがあるらしいです。ROOT権限があれば覗けるとか。
/data/data/[パッケージ名]/database/

iOS なら Mac の以下のパスに .sqlite ファイルがあります。
/Users/[ユーザー名]/Library/Application Support/iPhone Simulator/[ビルド時のiOSのバージョン]/Applications/[アプリのGUID]/Documents/
/Users/[ユーザー名]/Library が隠しファイル設定になっているので TinkerToolで表示させてやりましょう。

SQL ゼロからはじめるデータベース操作が Oracle, SQL Server, DB2, PostgreSQL, MySQL に対応していたので
勉強がてらに SQLite を対応させようと思います。
スマホアプリは SQLiteなのでマスターしておきたいですね。
2012/07/15

[Android]twiccaプラグインを作ってみた ツイート編集編

関連:[Android]twiccaプラグインを作ってみた ツイート表示アクション編 | DevAchieve
関連:[Android]twiccaプラグインを作ってみた 設定アクション編 | DevAchieve

入力中のツイートのテキストを受け取って編集して twicca に返すことができる。
<intent-filter>
    <action android:name="jp.r246.twicca.ACTION_EDIT_TWEET" />
    <category android:name="android.intent.category.DEFAULT" />
</intent-filter>
いい加減書くこともないので抜粋。
if(action.equals("jp.r246.twicca.ACTION_EDIT_TWEET")){
    String text = intent.getStringExtra(Intent.EXTRA_TEXT);
    intent.removeExtra("prefix");
    intent.removeExtra("suffix");
    intent.removeExtra("user_input");
    intent.putExtra(Intent.EXTRA_TEXT, edit(text));
    setResult(RESULT_OK, intent);
    finish();
}
受け取った Intent と返す Intent で Extras に共通しているところがある。
受け取ってセットし直すのもアホらしいので調べたら remove できた。コレは知らなかった。

[Android]twiccaプラグインを作ってみた 設定アクション編

せっかくなので設定も追加してみた。
関連:[Android]twiccaプラグインを作ってみた ツイート表示アクション編 | DevAchieve

設定用に PreferenceActivity を追加する。
PreferenceActivity は Android 3.0 以上からは Prefarence Fragment に置き換えられるらしい。
そして Android 3.0 未満は Compatibility Package というのを使って対応するらしい。
Support Library | Android Developersにある。
でもtwiccaプラグインの一つの項目しか無い設定画面1ページにそこまでするのが面倒大げさな気がする。
いや、はい。Xperia Arc(Android 2.3以上にアップデート出来ない宿命を背負った端末)から変えたら対応するよ…。

ということで Androidmanifest.xml に Intent を受け取れるように記述する。
設定アクション | Developers | twicca - Yet another Twitter client for Android.
<activity
    android:name=".QuoteTweetSettings"
    android:label="@string/app_name"
    >
    <intent-filter>
        <action android:name="jp.r246.twicca.ACTION_PLUGIN_SETTINGS" />
        <category android:name="android.intent.category.DEFAULT" />
    </intent-filter>
</activity>
QuoteTweetSettings.java で設定画面用XMLを onCreate() で読み込んで onStart() で色々する。
@Override
protected void onCreate(Bundle savedInstanceState){
    super.onCreate(savedInstanceState);
    addPreferencesFromResource(R.xml.pref);
}

@Override
protected void onStart(){
    super.onStart();

    final SharedPreferences sp = PreferenceManager.getDefaultSharedPreferences(this);
    CheckBoxPreference check = (CheckBoxPreference)getPreferenceScreen().findPreference(getString(R.string.key));
    check.setChecked(sp.getBoolean(check.getKey(), false));
    check.setOnPreferenceChangeListener(new OnPreferenceChangeListener(){
        @Override
        public boolean onPreferenceChange(Preference preference, Object newValue){
            if(preference.getClass() == CheckBoxPreference.class){
                if(preference.getKey().equals(getString(R.string.key))){
                    sp.edit().putBoolean(preference.getKey(), (Boolean)newValue).commit();
                    return true;
                }
            }
            return false;
        }
    });
}
sp を final にしておくと OnPreferenceChangeListener() 内で使えるから便利。
設定項目が多かったら無名インナークラスで書くのはやめたほうがよさそう。
クラスの比較はなんかできたのでやってみただけ。意味は無い。と思う。
複数の CheckBoxPreference の onPreferenceChange() を一回の記述で済ませられそう。
そのためにはキーを string.xml で string-array で保存すればいけるのかもしれない。

addPreferencesFromResource(R.xml.pref);で読み込んだやつ。
<?xml version="1.0" encoding="utf-8"?>
<PreferenceScreen xmlns:android="http://schemas.android.com/apk/res/android">
    <CheckBoxPreference
 android:key="@string/key"
 android:title="@string/title"
 android:summaryOn="@string/on"
 android:summaryOff="@string/off"
 android:defaultValue="false"
 />
</PreferenceScreen>
ハードコーディングすると変更時に死ねるので全部 string.xml にぶち込む。
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string name="app_name">QuoteTweet プラグイン for twicca</string>
    <string name="key">reply</string>
    <string name="title">リプライを入れる</string>
    <string name="on">QT @screen_name https://twitter.com/</string>
    <string name="off">QT https://twitter.com/</string>
</resources>
2012/07/14

[Android]twiccaプラグインを作ってみた ツイート表示アクション編

twiccaを使っているのでせっかくだからtwiccaプラグイン作りたいなぁ、ということで作ってみました。

ツイート表示アクション | Developers | twicca - Yet another Twitter client for Android.
<intent-filter>
    <action android:name="android.intent.action.MAIN" />
    <category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
コイツを消して、
<intent-filter>
    <action android:name="jp.r246.twicca.ACTION_SHOW_TWEET" />
    <category android:name="android.intent.category.DEFAULT" />
</intent-filter>
これに書き換える。

ついでにActivityを開いて何をするでもないので非表示にしといた。[Android]Activityを非表示にする | DevAchieve

@Override
protected void onStart(){
    super.onStart();

    final Intent intent = getIntent();
    if(intent == null){
        setResult(Activity.RESULT_CANCELED);
        finish();
    }
    final String action = intent.getAction();
    if(action.equals("jp.r246.twicca.ACTION_SHOW_TWEET")){
        final String statusId = intent.getStringExtra("id");
        final String screenName = intent.getStringExtra("user_screen_name");
        final String tweet = " QT https://twitter.com/" + screenName + "/status/" + statusId;
        tweet(this, tweet);
        setResult(RESULT_OK);
        finish();
    }else{
        setResult(RESULT_CANCELED);
        finish();
    }
}
忘れたけどgetIntent()はonStart()でやるべきって話を聞いたような気がする。詳しい話は忘れた。
後はコイツに投げてやるだけ↓
ツイート画面をアプリ/プラグインから呼び出す | Developers | twicca - Yet another Twitter client for Android.

GitHubにあげたー
wada811/QuoteTweetPlugin4twicca · GitHub
GitHubでTwicca Pluginで検索すると結構出てくるから参考になるよ。

[Android]Activityを非表示にする

アプリを起動するけども表示はさせない場合はコード中の setContentView の記述を削除すればいい。
しかし、これだけでは初回起動時に一瞬だけ起動アニメーションが見えてしまう。

表示させないようにするにはAndroidManifest.xmlの<application>タグか<activity>タグで以下のどちらかを記述する。
android:theme="@android:style/Theme.Translucent" // タイトルバーの表示あり
android:theme="@android:style/Theme.Translucent.NoTitleBar" // タイトルバーの表示なし
改訂2版 Android SDK逆引きハンドブック
改訂2版 Android SDK逆引きハンドブック
2012/06/30

[書評]iPhoneアプリ設計の極意 ―思わずタップしたくなるアプリのデザイン

iPhoneアプリ設計の極意 ―思わずタップしたくなるアプリのデザイン
Josh Clark
オライリージャパン
発売日:2011-06-18
ブクログでレビューを見る»
iPhone/Android関係なく全てのスマホアプリ開発者が読むべき本。
デザインと言うからエンジニアは敬遠しがちだと思うが、
機能美と言えばエンジニアがこだわるべき事だと認識してもらえると思う。
この本のdesignの意味は芸術的な見た目ではなく、設計のことだ。
帯に「デザイン≠アプリの見た目」「デザイン=アプリの機能+性能+UI」と書いてあることからもわかる。
本書を読めば今までのアプリを一新したくなるほどデザインについて学ぶことができる。
iPhoneアプリ設計の極意 サポートページ — 目次 — マーリンアームズ株式会社

ご購入検討中の方へ

アプリが売れなくて困っている人――この本を読んで売れるアプリに変えましょう
アプリを開発中の人――この本を読んでもっとよいアプリを完成させましょう
これから開発する人――まずこの本から始めましょう
Androidアプリ開発者――この本を参考にiPhoneアプリに負けないモノを作りましょう
アプリの舞台裏を知りたい人――この本でアプリがどんな風に作られているのかがわかります
iPhoneを徹底活用したい人――この本でとっておきのテクニックを学びましょう

そのほか、下記のような方々にもおすすめです。

iPhoneのいろいろなアプリを知りたい方
Appleの『ヒューマンインターフェースガイドライン』を、マニュアル的な文章でない文章で読みたい方
Apple(Apple製品)が好きな方
Apple製品がなぜ美しいのか知りたい方
いろいろなアイディアに触れるのが好きな方
エンジニアは本書からスマホに特化した機能美を学ぶことのできるだろう。
デザイナーは機能美を理解してこそ、いわゆるデザインを創れるんじゃないかと思う。
どっちかというと機能美というよりインダストリアルデザインかな?あまり一般的な言葉じゃないけど。
エンジニアがいわゆるデザインをできなくてもいいけどインダストリアルデザインはできなきゃダメだと思う。
デザイナーの立場はなったことがないからわからん。でも知らないでデザインってダメだよね。
つまりスマホアプリ開発者は必修教材なわけです。
O'Reilly Japan - iPhoneアプリ設計の極意で7章がPDFで丸々見ることができるので読んでおきましょう。
iPhoneアプリ設計の極意 ―思わずタップしたくなるアプリのデザイン
iPhoneアプリ設計の極意 ―思わずタップしたくなるアプリのデザイン

タグ(RSS)