仕事としてWebサイトやE-commerceサイトの提案をされている方なら恐らくいつも直面する問題だと思いますが、今回はWebサイトのモックアップを簡単に作る方法です。
私の場合は、
第一段階でエクセルやパワーポイントを使ってイメージを作成し、クライアントと完成形を共有し、
第二段階でHTMLで機能なしのフレームをつくり、ここでまたイメージを共有、
それから中身の作成に入っていきます。
が、毎回毎回こんな綺麗にプロジェクトが進むわけではなく、当然 なおし が入るわけです。その一つの理由は、ブラウザで見る場合とエクセル／パワーポイントで見る場合ではやはり少し見た目に差がでるからです。
一度オンラインのモックアップ作成ツールを使ったことがありますが、重すぎて仕事になりませんでした。。（確かpaint projectという名前だったと思うのですが、今検索したらなくなっていました。違う名前だったかもしれません。。）
今となってはエクセルやパワーポイントを使う方法で慣れてしまったので、共有しているイメージの齟齬による戻り作業は必要な作業だ！と納得させていたのですが、そんなことはないですよね。
工数が増えれば費用がかかる。費用がかかれば次のプロジェクトにかける予算が減る。次のプロジェクトができなければ売り上げ増が見込めない。負のスパイラルに陥ります。
そんな状況を解決するサイトを発見しました。簡単にモックアップを作成できるサービスのリストです。
サンプルの文言やタイトルを入れたりすることができます。私の場合は、コンポーネントを作ったら、”ここにコンテンツ” とか ”ここに説明文” とか説明をいれて凌いでいますが、これらのサービスをつかうと、実際に文字を入れてくれるので、文字量の増減により見た目がどうかわるかなどを明確に判断することができるというわけです。
Fake User Avatarというサービスはフェイクのユーザー写真を使うことができます。トップページにFacebookのウォールをいれる人がいると思いますが、そんなときに使えます。
どんどん便利なツールがでてきますね。便利なツールをどんどん使わないと、どんどん加速する世間の開発にかかる時間の期待値に答えられなくなります。つくづくエンジニアは日々勉強・日々情報収集だと思いました。