【Webエンジニア転職】ポートフォリオの作り方を徹底解説

実際にワイヤーフレームを描いてみると、仕様書で書いた機能を形にできるので楽しいですね。 これで大まかなサイトの構成図が出来上がります。 3：モックアップの作成 モックアップとは、プロダクトの完成図のことです。 先ほど作成したワイヤーフレームを元に、実際のデザインを絵に表すことで、サイト全体のイメージを掴みます。 僕が描いたモックアップはこちらになります。 モックアップ作成にはMoqupsを使いました。 Web上でサクサク描けて、URLで簡単に共有できるのでオススメです。 4：フロントエンド実装 フロントエンドとは、ブラウザから直接見れる部分のことを指します。 この工程では、仕様書やモックアップを元に、HTML/CSS/JavaScriptなどのフロントエンド言語を用いて、プロダクトのビューの部分（見た目）を実装していきます。 ここで初めて、仕様書やモックアップの大切さを実感することになりま

[tsu-nera]

“【”