モックアップ画面をいろいろ作る（CakePHP修行 #010）
June 28, 2007 2:48 AM written by Gen Taguchi

さてCakePHPのお勉強。前回までのあらすじはこちら。

» CakePHP修行！ アーカイブ | i d e a * i d e a

それから前回までの記事への突っ込みありがとう＞青い人！

さて今回はモックアップ画面の作成です。最初は「デザインはチョーてきとーでー」と思ったのですが、開発する上でテンションをあげるにはやはりデザインから。CakePHPと直接関係ないですが、画面のモックアップを作っていきます。

今回とりあえず作るのは次の3画面。作っているうちに課題は見えてくるでしょう。

• ログイン画面
• 自分の「ホーム」画面
• 友達の「ホーム」画面

ま、ちょろちょろと作るので本気度30%ぐらいで。シンプルかつミニマムがコンセプト。あと面倒なんでインターフェースはすべて英語にします（英語のタイポグラフィーのがきれいだから）。

つうわけでつくってみた画面。

■ ログイン画面

ログインしていない状態では全部これが出るようにします。

↑ とりあえず全表示状態なんでエラーメッセージも出しています。

■ 自分のホーム画面

こんな感じじゃないすかね？（http://www.codexcode.com/かな）

↑ ま、のちのち足したい機能が出てくるかと思いますがそれはそのとき考えましょう。写真は拝借しても怒りそうにない人から拝借しました。

■ 友達のホーム画面

自分のホーム画面のトップを残しつつ、その下を友達の画面に。わかりやすいかな・・・ま、いいです。ユーザビリティとかそういうのは。とりあえず。

URL的には http://www.codexcode.com/users/25 とかかな。

↑ メニュー的にはこんなところでしょ。今思ったけど友達の日記は友達の友達の日記じゃなくて友達の日記一覧だな・・・。

ただのモックアップ画面なんで細かいところは突っ込まないように。設定画面とか日記投稿画面はあとからつくります。今思ったけど日記に対するコメント作りたいな・・・。ま、あとでやりましょう。

■ 次回予告

で、全部つくると大変なんで、とりあえずログインしたら自分のホーム画面に行って自分のプロフィールが表示されるところまで作ってみたいと思います。

Info: CakePHP修行！ | 固定リンク | コメント (0) | トラックバック (1) | ↑