落書き(楽書き)カメラ Ver.1.1 サポートページ

落書き(楽書き)カメラVer.1.1の説明!
落書き(楽書き)カメラ Ver.1.1 は、iPhone & スマホ用のWebアプリです。
パソコンからアクセスしますと、このサポートページが表示されます。
Webアプリとして、無料公開中です。iPhone & スマホで、お試し下さい!
【iPhone & スマホのカメラで撮った写真の上に落書きができます。】
Sample Photo

【操作手順:iPhone】

1.初期画面
photo01

◎Ver1.1 : http://www.ozsystem.co.jp/camPaint/

2.[Camera or File]をクリックします
photo02

カメラを起動するか、撮影済の写真を選択します。

3.カメラで撮影します
photo03

撮影後、「写真を使用」をクリック。

4.写真がプレビュー表示されます
photo04

プレビュー画面は若干上に表示されます。(カメラではなくファイルを選択した時は元の位置で表示されます)

5.画面をスクロールします
photo05

プレビュー部分はペイント用キャンバスなのでスクロールが出来ません。上下のフラットなボタン部分(チョット狭いですが)を利用してスクロールします。

6.写真の上に落書きが出来ます
photo06

プレビュー画面下で色選択して下さい。「Color」をタップする度に、ペイントする色が変わります。ここでは、ピンクを選択してみました。

7.落書きは消せます
photo07

「Clear」ボタンで落書きを消せます。また、「Save As」ボタンで保存出来ます。
 

8.写真は保存出来ます
photo08

「Save As」ボタンをタップすると、写真と落書きが合成されて、一枚の画像になります。

9.保存します
photo09

画像の上を長押しして保存します。
保存画面下の「Back」ボタンで元の画面に戻ります。

10.元に戻る
photo10

保存画面下の「Back」ボタンで元の画面に戻ります。写真は、カメラを起動するとクリアされます。落書きは「Clear」ボタンでクリアして下さい。

11.ホームに追加します
photo11

ブラウザ下部の「ホームへ追加」ボタンをクリックして、アイコンをホーム画面に登録します。

12.登録成功!
photo12

次回からは、ホーム画面のアイコンをクリックすれば、アプリが起動されます。

【補足情報】

  • Webアプリなので、MobileSafari, GoogleChrome搭載の、iPhone & スマホで動作します。煩わしいAppleの認証がありませんので、気軽に機能の改変が可能です。
  • スタンドアローンタイプとして設定すれば、ホーム画面に登録後、ブラウザの上下の部分が消えてフルスクリーンになり、表示部分が広くなるのですが、iOS7のSafariで、画像の長押しが「コピー選択」になってしまいますので、敢えて、ブラウザモードのままにしてあります。
  • アプリケーション・キャッシュを使用する事で、オフライン対応も可能ですが、こちらもiOS7のSafariが不安定なので、オンライン版としています。
  • また、iOS7のSafariで、再読み込みをした際に、真っ白なページが表示される場合があります。原因は不明ですが、Safariを終了し、「設定」の「Safari」で、キャッシュ、履歴をクリアした後、再度アクセスすれば、問題なく表示されます。
  • 今回のバージョンは、ローカルへ保存するタイプですが、別途PHPにて、WebDBシステムを構築し、サーバへ画像をアップロードする事も可能です。

【更新履歴】

  • 2014/6/6 : 無料Webアプリとして公開しました。
  • 2014/7/12 : 「落書き」を「落書き(楽書き)」に変更しました。
  • 2014/7/12 : ペイントの色選択部分を改修しました。
    「Color」をクリックする度に、ペイントの色が変更されます。(全8色)
  • 2014/7/17 : サポートページを、ランディングタイプからパララックスタイプへ変更しました。
    ※ブラウザの関係で、上手く表示出来ない場合は、こちのランディングタイプをご覧下さい。

【謝辞】

  • このWebアプリを制作するにあたり、「jQuery canvasResize plugin Version: 1.2.0 」を実装させて頂きました。https://github.com/gokercebeci/canvasResize
    iPhoneでの撮影時に、メガピクセルになり、Canvas上で画像に不具合が発生するため、上記のプラグインでリサイズします。
  • また、このサポートページを制作するにあたり、「fullPage 2.1.2」を実装させて頂きました。https://github.com/alvarotrigo/fullPage.js
    ◆Google Chrome 35, Firefox 30, Safari 7, IE 11 以降にて動作確認済
    ◆不具合報告:Safari 5 では「操作手順」で横展開後、他のページでのクリックが効かなくなります。

Valid XHTML 1.0 Transitional  オズシステムのWebサイトはお陰さまでW3C認証済です。

オズの電話番号:044-953-4881
facebookoz1992をフォローしましょう

ご不明な点等御座いましたら、お気軽にお問い合せ下さい!

 
オズシステム有限会社
〒215-0007 神奈川県川崎市麻生区向原2-8-9
PHONE & FAX:044-953-4881 (営業時間:土日・祝祭日等除く平日9:00〜17:00)