##出来上がりのサイト
薬価検索アプリmedipraはこちらです
→ 見に行ってみる
前回の内容はこちら。
【開発日記】薬価検索アプリno.2 〜設計・機能の洗い出し〜
開発背景などはこちら
【開発日記】薬価検索アプリno.1 〜開発概要→企画〜
##現在の進捗状況
1.必要な機能の洗い出し
2.必要な画面設計 ⬅︎今ココ
3.データベース設計
4.Railsでアプリケーションの雛形作成
5.大きな機能から順に実装
6.テストコードを書いて動作を担保する
7.リファクタリングして整理する
8.デプロイ
#画面設計
今日は画面設計をしてみます。
開発するアプリケーションで必要な画面の設計をします。画面がどれだけ必要か、どのような画面にするかをこの段階で決めます。
一応、元ネタというか、参照サイトはこちらです
薬価サーチ
大体は同じように実装してみようかと思います。
##ワイヤーフレーム
今回のアプリは画面設計から自分なので、せっかくなのでワイヤーフレームなるものもやってみようかと思います。
ワイヤーフレームを作る際に使えるツールはこちらによくまとまっていますのでどうぞ
Webディレクターにオススメしたい!さくさくワイヤーフレームが作れちゃう便利ツールまとめ
今回は、prottというサービスを使ってみます。
30日間は無料です。
#とりあえず作ってみました。
こういうの、考え始めると難しいですね。。。
まずはこの程度はMVPとして作りたい、という目標の意味も込めて。
この辺は少しずつ改善していきます。
#prott
無料期間は30日間しかないですが、使い方は本当に簡単で楽なので、本格的にワイヤーフレームを作る必要が出てきたらぜひ使いたいです。
左サイドにはフォームボタンや、パンくず、ページネーションなんかもすでに用意してあって、そのままドラッグすればOK。
Webに合わせたものや、iOSに合わせたものも色々用意してあるので、なんとなく並べるだけでも十分それっぽくなる勢い。
画面右にはプロパティが表示され、文字の大きさ、背景色の変更などが行えます。
#まとめ・所感
こういうデザインとかって、サイトの目的や、誰が使うか、何を伝えたいのかなどがはっきりしていないと全く決まらない。
今の開発では既存サイトの改善版を作ろうとしているだけなので、自分で欲しいイメージがある程度はあるけど、全くのゼロからサイトを作ろうとしたら、本当に大変な仕事だと実感。
デザイナーさんありがとうございます。(一緒に働いたことないけど)
最後までおつきあいいただきありがとうございました。