AndroidからDropsyncを使って自動でFlickrへアップロード

Dropsync

DropBoxがカメラ用のフォルダに保存された画像を自動でアップロードしてくれるようになったものの、それ以外のフォルダに保存された画像をそのままではアップロード出来ないのでDropsyncを使ってDropBoxへアップロード、そしてさらにDropBox AutomatorでFlickrへアップロードできるようにしてみました。

まずはDropBoxを登録。Androidアプリもインストールし、その後、DropBox AutomatorへDropBoxのアカウントを使ってログイン、「Create a new automation」を押すとフォルダごとにタスクを設定できるのでPhotosフォルダにある画像をFlickrへアップロードするように設定。ここまでの状態ではDropBox上のPhotosフォルダに画像を入れないとFlickrには反映されないので「Dropsync」を使います。

DropsyncはPROが複数設定できるのですが、有料なので今回は普通のバージョンを使い、自分が使っているカメラが画像を保存するフォルダを指定、同期先をDropBoxのPhotosフォルダに設定。すると設定した時間毎に同期をしてくれます。

大量にとって後でどれを消すか一つ一つ見ていくより、アップロードされたものはとりあえず削除できるようになるので、容量が切迫するようなことを防ぐことができます。

iPhoneなどiOS向けにはPogoplugを利用するとPogoplugのクラウド上へ自動アップロードしてくれるのでiPhone出と考えている方は一度使ってみてはいかがでしょうか?

近々Pogoplug モバイルを導入する予定なのででき次第またブログを更新します。

  • できるポケット+ Dropbox+(できるポケット%2B)
  • クラウド活用テクニック100―Evernote+Gmail+Dropboxを使いこなそう!+すぐに使える実用的+(超トリセツ)
  • Dropboxポケットガイド
  • すぐわかるポケット!+仕事にすぐ効く!+シュガーシンク+SugarSync+自由自在+(すぐわかるポケット!)
  • シュガーシンク+SugarSync+完全活用術+文書も音楽もクラウドに保存!+iPhoneでも使える万能保管庫
  • Evernote×SugarSync×Google+クラウド活用パーフェクトブック
  • Pogoplug導入ガイド

linked by blog-tools

jQueryを使う理由

最近はJavaScriptよりもjQueryという言葉を目にする機会が増えてきた。

jQueryはJavaScriptを扱いやすくするために使うフレームワーク(もしくはライブラリと呼ばれているもの)の一つで、ほかのフレームワーク、prototypeなどと比べると視覚的にプログラムを組むことができる。

簡潔に言ってしまえば、「AのときBの動作を行う」これが基本でjQueryのプラグインと呼ばれているものを使えば、前述のBのバリエーションを簡単に増やすことができ、そしてCSSなどでも使うHTML上のセレクターが扱いやすい構造になっているので、結果としてWebデザイナーやマークアップエンジニアにも難なく使えるものになっている。つまりは手っ取り早くJavaScriptが使える。

たとえばスライドショーの機能や動くスクロール遷移、検索入力欄にウォーターマークを追加するといったことに使われ、年始にアップした年賀状サイトおみくじのプログラムも主なものはjQueryでできている。

JavaScript自体は10年以上前から使われているのに、どうして最近になってjQueryが目立つようになったのか、昔はドラック&ドロップさせるにも処理速度が乏しく、ぎこちないものになりがちだったものが、現在では端末やブラウザーの性能が向上したお陰で特に問題なく、まるでアプリケーションのような動作をサイトで行うことも出来るようになってきた。

今後、スマートフォンなどのカメラデバイスやコンタクトリストなどとブラウザーが連携を取れるようになるとアプリケーションをマーケットなどからインストールする手間をかけなくても様々なアプリケーションを使える時代が数年でやってくる。となるとアプリ開発もJAVAやObject CベースのものからWebベースのサーバーエンドのプログラミングとブラウザーベースのフロントエンドのプログラミング、マークアップになる。つまりはjQueryなどが今以上に使われるようになる(はず)

近々cdbk.net CREATIVESのサイトを作り替えるのでその際作ったplug-inは公開していく予定です。

スマホサイトを初心者がはじめる前に

Sony NEX-5N test shot: Samsung Galaxy Nexus
Creative Commons License photo credit: jfingas

この1,2年でモバイルといえば携帯サイトだったものがスマホサイトになってしまい、これからどうしようか? どうすればいいのかと思っている初心者の人も多いと思うので少しまとめました。

まずは、実際にスマートフォンに触れて見る

百聞一見に如かずで実際に触ってみるとわかることが本当に多く、 例えば、タッチパネルの操作ではボタンは押した感触がない反面、フリックやスライド操作ができるので、直感的に操作できることが多くなっています。

Twitterのスマホサイトではアプリケーションのようにスムーズに使えるよう、タイムラインを下に引っ張るとリロードされたり、ツイートをスライドするとReplyやRetweetアイコンが出てきたりします。 一昔前はFlashを使って動かしたりしていたものがJavaScriptの処理が高速化したため、HTML、CSSと連携させてJavaScriptでインターフェイスを作ることが一般的になっています。

Web制作初心者には敷居が高い現実

先ほどのTwitterの事例のように、いつも使うようなサイトに使いやすいインターフェイスが提供され、ブログなどでもメニューボタンを押すとメニューが伸びてきたり、次のページヘ移動する際、更新されるのではなくスライドして次のページに進むようなギミックがあったりと、気にしてみると初心者にはどうやって作っているのかわからないことが数多く出てくると思います。 技術的には少し前に話題になったWEB2.0といわれるものの中の技術が使われ、一昔前に使っていたテーブルレイアウトは姿を消し、HTML+CSSをベースに幅が変わっても対応できるリキッドレイアウトや新たに出てきたレスポンシブレイアウト(デザイン)と言われるようなレイアウト手法が主流になりつつあり、実際にユーザーやクライアントが要求してくるようなスマホサイトを作ろうとするとHTML(HTML5)やCSS(CSS3)そしてJavaScriptの習得が必要になってきます。

ではどうするか?

HTML5とCSS3、JavaScriptを習得してサイトを作ることが出来れば一番いいのですが、より手っ取り早くスマホサイトを作りたい場合には

  1. Webサイト作成ソフトを使う
  2. スマホに対応したブログやWebサイトサービスを使う
  3. プロに頼む

の3つの選択があります。

スマホサイトに対応したアプリケーションが増えてきたので、テンプレートをベースにコンテンツを作っていくような作り方をする際、効率的につくることができます。ただ、仕事を依頼されてデザインやコーディングを行う場合は、テンプレート上、表現の限界があるのでスライドショーは追加できるけれど、フリックで動作しない、ここのスペースには置けないといったことが出てくるので注意が必要です。 主なアプリケーション:BiNDホームページビルダーなど

ブログやWebサイトサービスを使うとブログを編集するような感覚で比較的簡単にスマートフォンに対応させることができます。サービスを利用することでスマートフォン用に特別な編集をせずページを作成できるので初心者でも使いやすいと思います。主なサービスはJimdoカラミーショップ(ECサイト向け)など

スマホサイトができたものの、iPhoneではちゃんと表示されるのにGalaxyでは崩れる、タブレットでは文字が小さく、レイアウトが広がって見辛い、画像がなんかぼやける。といったことがよく起こります。それに対応するにはネットで解決方法を探し、ない場合はトライアンドエラーを繰り返し、解決法を身につけていくほかありません。 時間がない場合、自分には難しすぎると感じた場合はプロに頼むという選択肢があることも念頭において、どのように作るかを考えて自分にあった選択肢を考えるといいと思います。

次回は具体的な作り方について書く予定です。

缶の形をしたタンブラー「Biodegradable 」

NewImage

普通のトールサイズのタンブラーより少し小さめの350ml缶サイズの密閉型タンブラー「Biodegradable」。

冷たいものから温かいものまで対応ができてフタを取り外せばレンジもOKなところが便利。

素材はトウモロコシを使った自然分解可能なプラスティックで中は2重構造。熱いものを入れても持てなくなるようなことはなく、見た目はジュース、中身はコーヒーが可能。

オフィスで使えばいろんな意味で注目を浴びそうですが、何より密閉型なのでキーボード水没は防げそうです。

  • Biodegradable+バイオディグレーダブル+ポータブル+ドリンクボトル+[+ブルー+]
  • Biodegradable+バイオディグレーダブル+ポータブル+ドリンクボトル+[+ホワイト+]
  • Biodegradable+バイオディグレーダブル+ポータブル+ドリンクボトル+[+レッド+]
  • Biodegradable+バイオディグレーダブル+ポータブル+ドリンクボトル+[+ピンク+]
  • Biodegradable+バイオディグレーダブル+ポータブル+ドリンクボトル+[+グリーン+]
  • Biodegradable+バイオディグレーダブル+ポータブル+ドリンクボトル+[+ブラック+]

linked by blog-tools

レシピ本サイトを作りました。

KURIMO(クーリモ)  ギフトサイト

Iluvrecipe 01

最近外食より内食が主流なので家にレシピ本も増えてきたので、良さそうなものを集めてサイトを作ろうと思い、作りました。

名前は「I ♥ recipe.」。AmazonのAPI使っているのでAmazonに載っていないものは載せられないのですが、独自のカテゴライズをして増やしていく予定です。

最近はシリコンスチーマーやココットなどの調理器具がセットになったムック本などもあるのでバレンタインのために作ってみるなどしてもいいかもしれません。

個人的には小太り系のレシピ本をもっと載せたいところですが、できるだけ作りやすそうなものを中心にということで。

この本も載せてほしいなどリクエストあれば、コメントいただけると幸いです。

Iluvrecipe 02

レシピ本の話はここまでで、ここからはサイトの仕様。

システムはWordPressを使い、HTML5+CSS3+jQuery+less.jsで制作。

タグ部分やサムネイル一覧はjQueryで少し回転させてワンポイントにしています。

トップから本の詳細ページを見る際は基本、Lightboxのようにページ内で表示させるようにしています。

WordPressのテンプレートとして別途改変して普通のブログでも使えるようにするかは現在模索中。