ABOUT

このプロジェクトは、管理効率を最大に上げるためにWEBディレクターが生み出したGooglePicasaを利用したWEBデザインのプレビュー方法です。

About - このプロジェクトについて

このプロジェクトは、WEBディレクターを数年やっている私が思ういくつかの不満を解消するためにできた小さな小さなプロジェクトです。

  1. JPEG画像がとびかう不甲斐ないやりとりに嫌気がさす
  2. スクリーンのデザインなの、紙ベースでやりとりされる残念な社会
  3. なぜかディレクターがプレビューを作っている時間のムダ

知識がない人もさくっとプレビューできれば、仕事も減って話も早いんじゃないの?という安直で素朴な発想からはじまりました。

View Demo - 出力されたページ

用途に基づき、様々なテンプレートを作成しました。
出力方法は、写真管理ソフトであるPicasaでタイトルや順番などを設定し、エクスポートするだけ。
複数の画像でもワンクリックで確実にプレビューHTMLを作成することができます。

StaticDesignStyle for Desktop & Tablet

img1
スタティックデザインのテンプレート。ピクセル固定の通常ウェブサイトをプレビューするときに便利です。

View Demo


100%widthStyle for MobileSite & FullscreenSite

img2
横幅100%表示のテンプレート。フルスクリーンのPCサイトやスマホサイトをプレビューするときに便利です。

View Demo


Advance - 高機能バージョン

+zip

一覧ページから画像をまとめてダウンロードできる機能をつけました。
※フルパッケージ版に含まれます。

View Demo

Specification – 仕様と推奨環境

Export by Picasa:Picasaを使った書き出し

Picasaでの出力は、以下の環境で動作確認をしています。
- Windows 8 / Picasa3
- Windows 7 / Picasa3
- MacOS 10.9 /Picasa3

TempletePreview by Browzer:ブラウザでの確認

出力されるHTMLの閲覧確認状況は以下のとおりです。
- Windows 8 / Chrome, Firefox, InternetExplorer10
- Windows 7 / Chrome, Firefox, InternetExplorer8
- MacOS 10.9 / Safari, Firefox, Chrome

install – インストールと設定

STEP01: Picasaをダウンロード

Download Picasa


STEP02: テンプレートをダウンロード

Trial Download

まずはお試しください。

FullPackage Download

使用感が良ければ、多彩なテンプレートをお試しください。
pay by gumroad

STEP03: テンプレートを特定のフォルダに配置

windows7 または8の場合:

通常通りPicasaをインストールすれば
C:Program Files (x86)GooglePicasa3webtemplates がテンプレートの格納フォルダになります。
そこに解凍したファイルをコピーしてください。

MacOS:

アプリケーションフォルダまで進み、Picasaを選択。右クリックで「パッケージ内容を表示」。
Contents > Resources > web > Templetes がテンプレートの格納フォルダになります。
そこに解凍したファイルをコピーしてください。

STEP04: Export

picasaの設定が終わったら、写真を選んで、書き出したいテンプレートを選択しエクスポートします。
※エクスポートされたフォルダをFTPでWEBサーバーにアップして活用します。

Download – ダウンロード

Trial Download

まずはお試しください。

FullPackage Download

使用感が良ければ、多彩なテンプレートをお試しください。 pay by gumroad

FeedBack

フィードバックは、下記のコメントページからお願いします。
※業務の傍ら対応いたしますので、レスポンスが遅れるかもしれませんがご了承お願い致します。

FeedBack