フリーランスの仕事、外出先でデータを確認するときのスマホ活用法

複数の案件を抱えていると移動中にメールでデータやダウンロードのURLが届き、その場で返事が必要なこともしばしば。

数100MBを超えるデータはスマホで受信するのは辛いのでパソコンでとなりますが、数10MBぐらいの容量であればWifiがあれば楽に受け取れるので、移動中にデータを受信して確認→返事までできるとレスポンスがいいので次の仕事にも繋がりやすくなります。ということで実際自分が使っている方法をまとめました。

いろいろなファイル形式を扱うならAndroidで

 iPhoneは確立され使い勝手がいい反面、扱えるファイル形式に制限があるため、添付したファイルが開けなかったり、保存できなかったりするので、仕事でスマホを最大限活かそうと考えるとAndroidに。できれば解像度の高い、ファブレットサイズで容量に余裕があるものが最適。GALAXY Noteシリーズはペンが使えるので長文のメールや文章も手打ちと比べるとかなりやりやすいです。

あると便利なアプリはファイルマネージャーアプリ。メジャーなアストロやESであれば、ファイルの移動やコピー&ペーストから圧縮ファイルの解凍等もできるので一種類入れておくと便利。

またoffice系のアプリがあるとその場で見れるので、ない場合は入れておく。そして大事なのは実際にファイルが開けるか必ず試す。実際と表示にずれがあったり、ワードアート等が表示されなかったりする事があるので事前の確認を。

DropBox+DropSyncでスマホにもデータを保管

 クラウドサービスのアプリはほとんどのサービスで提供されているのですが、基本的にパケットや速度の問題もあり、スマホ本体とは同期化しないのでDropBoxの場合は同期化するフォルダを設定できるDropSyncを使う。有料のキーを買うと制限なしですが、無料のままだと設定できるフォルダ数等に制限があります。

進行中の案件のフォルダを設定したり、スマホでダウンロードしたファイルを入れるフォルダを同期化したりすることでファイルの容量に左右されますが、パソコンを開いてすぐスマホでダウンロードしたファイルをパソコンで開くといったことが容易になります。

 スマホでWebサイトのソースコードを見たいときはChrome

 出先でパソコンが開けないけれど、ソースがおかしいといった指摘がきたとき、ソースコードを一番手っ取り早く見る方法はChromeのソース表示を使う方法。アドレスバーに「javascript:window.open(“view-source:”+location.href);」と打つと今表示しているページのソースコードが表示されるのでコピー&ペーストできるようにしておくか、「javascript:var url=prompt(“url:”,””);window.open(“view-source:”+url);」をブックマークしておくと押したときにURL入力欄が出るのでそこにアドレスをコピー&ペーストするとソース表示されるようになります。

  • 【新品★海外版SIMフリー】HTC+ONE+Dual+SIM+802W+dual+デュアルSIM+[並行輸入品]+(ホワイト)
  • HTC+One+SIMフリー+海外携帯+(32GB%2C+シルバー)
  • GALAXY+S4+SC-04E+docomo+[White+Frost]
  • GALAXY+S4+SC-04E+docomo+[Black+Mist]
  • 【バーゲンブック】+Dropboxポケットガイド
  • Dropbox+WORKING
  • クラウドからサーバー、セキュリティまで失敗しないIT導入をサポート+クラウド時代の製品・サービス選び+Vol.1+(アスキームック)
  • iPhoneやAndroidでも使えるGoogleクラウドサービス活用術―全て無料で利用できる!+(メディアボーイMOOK+ビギナーズPC)

linked by blog-tools

ドコモでiPhoneを使うときにやっておくと便利なことメモ

NewImage

ドコモからもついにリリースされたiPhone。SPメール等、まだ使えないサービスもある中で、昨年の11月から使っている中で役に立った便利なこと等をまとめてみました。

連絡先はGmailで一括管理

Androidを使っていた場合はそのままiPhoneの設定からメール/連絡先/カレンダーのアカウント追加からExchangeを選択してGoogleアカウントを入力すれば連絡先の同期が可能でカレンダーなども使えます。

自分はガラケーからiPod touchへ連絡先のデータを移行するときにGoogle contactを使うようになったのでAndroidやiPhoneへの移行はかなり楽でした。Gmailから連絡先を登録すればすぐにiPhoneにも同期されるので非常に便利ですが、セキュリティ対策を考えるなら2段階認証などを導入するのがベスト。

SPメールがそのままでは使えないのでその対策

SPメールをドコモでiPhoneを使う際は使えないので使いたいときにSIMカードをAndroid端末に差し替えて使う、もしくは別途i-modeの契約をしてi-mode.netを追加。パソコン等でi-modeメールを受信できるよう、App Storeで購入できるi-mode.netメールが受信できるアプリを使うといった方法があるものの、iモードのメールアドレスの変更や設定にはガラケーからiモードに接続してやらないとできないことが多いので、オススメできず。

一番のオススメはキャリアメールから別のIMAP対応のメールサービスへの移行。自分はGoogle Appsを使っています。

おサイフケータイが使えないのでその対策

EdyなどはiPhoneに対応していないので今使っている端末のポイントは使い切る。マクドナルドやヨドバシカメラのアプリはかざす機能が使えないのでバーコードやクーポンの表示ができるようになっています。自分はGALAXY Note2と2台持ちなのでFelicaが必要なものは基本的にAndroid。Edyはカードが便利ですが、オートチャージ機能が使えないのが少し面倒・・・。

Chromeはブックマークの同期機能が便利

Chromeはアカウント上でブックマークが利用でき、その中のモバイルのブックマークがモバイル向けのブックマーク領域になります。よく使うサービスのモバイルサイトなどを登録しておくと便利です。

ガラケーからiPhoneへ替えるパソコンヘビーユーザーにオススメのツールなど

気になるサイトや記事をブックレットで保存してあとから読むことができるpocketやRSSリーダーのFeedlyはあとからまとめてニュースをチェックしたいときにオススメで、どちらもパソコン、iPhone,Androidなどに対応。通勤時間などにサクサクチェックできます。

その他定番のYahoo!アプリやジョルダンなどの乗り換え案内、全国タクシー配車、ウェザーニュースなどは仕事の移動中などで役に立つことが多いので使うときに入れておくとよいと思います。

何処からアプリを探す?

Androidと比べると質の悪いアプリは少ないですが、最初、何処で探すかは悩みどころ。

App Storeのおすすめにあるアプリはベストセラーが多く、レビューも多く書かれているのでそういったところからはじめてみるのがオススメ。有料のものはクレジット決済のほかコンビニ等で買えるiTunesカードをつかって決済ができます。アプリや音楽、映画にも使えるのでプレゼント等にもいいかもしれません。

タブレット向けサイトのサイズがうまく出来ないときの対処法

この1年、タブレット向けのサイトを作る機会が増えてきたので実際の解像度とブラウザーの表示サイズが異なることで起こる問題の対処法をまとめました。

ランドスケープ表示とポートレート表示、双方できれいなレイアウトで見せたいとき

ターゲットとするタブレットのアスペクト値によって多少変わりますが、CSS3のmediaqueriesを使い、2サイズをだし分けるのが最も簡単で失敗しない方法だと思います。JavaScriptで回転した際にviewportを書き直してもよいのですが、端末によって挙動や動きが異なる場合が多いので、mediaqueriesなどプログラムをなるべく使わない方法でレイアウトを変更するのが得策。
書き方は

@media screen and (max-width: 820px) {/*820pxまでのサイズのとき*/body{}...}
@media screen and (min-width: 820px) {/*820px以上のサイズのとき*/body{}...}

といった書き方になります。

実際の解像度で作ったところ、拡大表示されてしまうとき

viewportをwidth=device-widthで設定したにもかかわらず、拡大表示される場合があります。
その場合はinitial-scaleを1以下の数字にして縮小表示させることでタブレットのサイズに合わせます。
たとえば
<meta name=”viewportcontent=”width=device-width, initial-scale=0.66,minimum-scale=0.66,maximum-scale=2” />
といった書き方。

微妙に横幅が大きくなり、スクロールしてしまうとき

viewportやmediaqueriesを使い、サイズを合わせたものの、微妙に幅が合わず、スクロールが出てしまうときはCSSでbodyや一番外側のブロック要素にoverflow-x:hiddenの設定を追加します。
そもそもの改善にはなりませんが、横スクロールしなくなり、ユーザビリティが多少改善されます。

リキッドレイアウトを活用して様々なサイズに対応させる。

スマートフォンやタブレットでは出来る限り画面サイズ幅いっぱいにコンテンツを表示させたいので、幅指定を100%にすることを前提に、スマートフォンとタブレットでのコンテンツ表示を共有する場合やレスポンシブデザインを行う場合にはmediaqueriesを使い、全体幅とブロック要素の回り込み、表示非表示を制御します。

アドレスバーを非表示にする+ひと工夫

スマートフォンでもよく使われる方法ですが、JavaScriptを使い、アドレスバーを消すことで画面の高さーステータスバーの高さをコンテンツに当てることが出来ます。ランドスケープの場合ファーストビューの領域がアドレスバーで削られてしまうときの弊害が大きいので下のようなスクリプト(jQuery)を追加することで対処します。

function onloadpage(){
	setTimeout(function(){
	var h = $("body").scrollTop();
	if(h==0){
	setTimeout(function(){ window.scrollTo(0,1); },110);
	setTimeout(function(){ window.scrollTo(0,0); },111);
	}
	},100);
}

読み込み中にユーザーがスクロールしているときには動作しないよう、スクロールを検知するようにしています。
気になるところはご指摘いただければ対応します。また何かわかれば追記します。

AndroidアプリでWebViewが異様に重いときの解決Tips

仕事でアプリのWebViewを使ってサイト内コンテンツを表示したところ、動作もたついてしまった事例がありました。
そのときの解決法が思いのほか簡単だったのでメモがてら記載。
動作がもたついてしまう主な原因は
1.アニメーションのコンテンツがある。
2.CSSの設定が複雑。
3.CSSのエフェクトを使っている。
といったところが主な原因。
自分が仕事でぶちあたったのは3つ目で角丸にするborder-radiusと影をつけるbox-shadow,text-shadowを取るとかなり動作が解消されました。
その他JavaScriptで0.何秒毎に、、、といった処理を加えている場合も一度最適な数値をいろいろ試して導いてみると効果が出る場合があります。
今後、OSやブラウザーのアップデートと合わせ、WebViewの高速かも進むと思いますが、Webブラウザーで100%信頼できる動作もWebViewでは動かない場合があるので、認証や決済時に使う場合は注意が必要です。

  • Google+Androidアプリケーション開発入門+画面作成からデバイス制御まで――基本機能の全容
  • HTML5とJavaScriptによるiPhone%2FAndroid両対応+アプリ開発ガイド
  • アプリ%2FWeb開発者のための+フラットデザインガイドブック【iOS+7・Android・Windows+8対応】
  • Androidアプリ開発実践ノウハウ128
  • スマートフォンのためのHTML5アプリケーション開発ガイド―iPhone%2FiPad%2FAndroid対応

linked by blog-tools