第七回 システムの設計図作成1 画面図ワイヤーフレームを作ろう！

こんにちは

第7回目です。テーマは

システムの設計図作成1 画面図ワイヤーフレームを作ろう！

です。

システムを依頼する際は、簡単な画面図と仕様書をつくっておくと、

スムーズに開発が進みます。

今回よりイメージしやすいよう

楽天などショッピングモールの受注ページから取得できるCSVを取り込んで、表示させるシステム

を作成することを前提に進めていきましょう。

ポイント 1つ目の画面図(ワイヤーフレーム)の作り方

を説明いたします。

ちなみに画面図(ワイヤーフレーム)とは、システムが完成した時の画面レイアウトを描いたものでこんな感じです。↓

ではどのように作るのかというと、

Moqupsというツールが個人的にすごく使いやすくおすすめですので、こちらを

利用してみましょう。

はじめて利用される方はこちらの記事を参考に会員登録して、触ってみてください。(簡単な画面作成方法も載っています)

関連: Web担当者必見！ Moqupsでワイヤーフレーム入門

このツール一つで画面図(ワイヤーフレーム)は十分作れます。