大学の留学生向け事業紹介デザイン（トップ・下層ページの2イメージ＋RWD・コーディング不要の仕事

依頼の募集内容

発注者が選定した提案

実際の支払い金額

52,160 円

実際の受注者

id1027 本人確認

ウェブデザイン/ディレクション

「大学の留学生向け事業紹介デザイン」のご提案をさせていただきます。 スケルトンをベースにシンプルで洗練されたイメージでデザインいたしました。 フラットデザインを採用し適度に色をいれシンプルながら寂しくならないよう意識しています。 タイトル部分は仮にロゴマーク的なものも設定していますが、決まったものなどあれば差し替えいたします。 レイアウトはブロック化したコンテンツを1カラム300pxを基準の幅として、ブロック内で構成するイメージにしています。 上記の基準を設ける事により、2カラム、3カラムなどに拡張したり、高さに変化を与える等、柔軟な対応ができるかと思います。 また、RWD対応（tsau_sp.jpg）としてはスマートフォンは1カラムで縦に流し込み、タブレットはもっと見る

この度は素晴らしいご提案、ありがとうございました。 また機会がありましたらよろしくお願いいたします。

集まった提案(一部)

詳しい依頼の募集内容

概要・特徴

大学で行う海外からの留学生受け入れプログラムを紹介するサイトのデザインを募集します。画像イメージのみの募集です。日本語版ページも作成しますが、海外からのアクセスを重視しているためベースを英語版とし、英語でのデザインとなります。HTML5でのコーディングを予定。

コンテンツのボリュームが少ないなので直接的な比較ができませんが、イメージとしては欧米の大学ウェブサイトで主流になっているフラットデザイン的な方向が良いと考えています。

他大学の同事業のパンフレットは参考になると思います。
http://www.tuat.ac.jp/~intl/aims/download/AIMS_one_semester_2014-15.pdf

参考）
http://web.mit.edu/
http://www.harvard.edu/
http://www.stanford.edu/
http://www.cam.ac.uk/
http://www.ox.ac.uk/
http://www.berkeley.edu/index.html
http://www.princeton.edu/main/
http://www.yale.edu/
http://www.caltech.edu/
http://www.columbia.edu/
http://www3.imperial.ac.uk/
http://www.uchicago.edu/
https://www.umich.edu/
https://www.umich.edu/
https://www.ethz.ch/en.html
https://www.cornell.edu/
http://www.jhu.edu/
http://www.utoronto.ca/
http://www.nus.edu.sg/

依頼詳細

トップページ、下層ページで各1パターンの画像。FireworksまたはPhotoshopでの納品。細部をこちらで調整する可能性があるのでレイヤー、オブジェクトのグループを解除可能なようにお願いします。

トップページでのヘッダ、メニュー、フッタのデザインを継承し、第2階層用のイメージを展開します。H3～H6、ｐ、table,th,td、blockquoteなどのデザイン、色使いを含めてください。

今回、または将来的なレスポンシブルデザインを予定しているので、余力があれば幅を縮めた時のイメージもお願いいたします（PC/モバイルで完全な別デザインではなく、ヘッダ・フッタ、メニュー周りのみを変化させて、コンテンツ部はそのまま流用することを考えています）。

960px以上ではサイト幅960pxで固定中央をイメージ。ブラウザ幅が広いときに左右の空間がポカンとあかないような背景などの工夫を希望。
960px未満でタブレット、480px未満でスマホをイメージしていますが、要素が流用できるデザインならばタブレット・スマホで明確に分ける必要はありません。

サイトURL

設定なし

ページ数

2ページ

希望イメージ

シンプル 複雑

単色 カラフル

暗い 明るい

日常 高級

遊び心 厳粛

未来的 伝統的

女性的 男性的

希望する色

設定なし

納品ファイル

• フォトショップ形式 (.psd)
• PNG形式 (.png)

補足説明

ラフ・スケルトンを添付しますので参考にしてください。スケルトンにある各指示についてはPCサイトでの横960pxのみ必須。それ以外は参考程度にお考え頂き、ある程度ご自由にデザイン、ご提案ください。スケルトンの背景色はエリアの区切りを判りやすくするためだけで、実際のカラーをイメージしていません。メニュー内の文字列はそのまま使用する予定です。

PCサイトのイメージから展開されるRWDイメージの出来がよければ選定上ポイント高いですが、あくまでもPCサイトのイメージクオリティを重視しています。

スケジュールが短く、6月最終週～7月頭に集中して調整の依頼をする可能性があります。昼の正規のお仕事などがあるなどでレスポンスが悪くなる方は応募をご遠慮頂ければ幸いです。

その他、ご不明点があればご遠慮なくお問い合せください。

ご提案が集まらないようなので様子を見て期間を延長する予定です。ご指摘があったように曖昧にしすぎたかもしれません。
以下、こちらで想定したイメージを例示します。コーディングや可能な範囲の画像加工はこちらで行いますので、動作ギミックについては説明や個別の動作イメージで問題ありません。

★2階層目のコンテンツ領域。各要素での要求はmotown様のような内容で問題ありません。
★想定されるコンテンツ量が少ないので色々な要素が入る事は無いのですが、シンプルながら寂しくない印象を求めていました。
新着ニュースも数多くないのと、スペース的な間を埋めたいと言うことで、
http://www.tsukuba.ac.jp/
http://www.ryukoku.ac.jp/
上記のニュース欄のようなブロック型を想定してます。例示ではタブや表示エリアでカテゴリ分けしていますが、カテゴリ分けするほどの分量が無いため全てを混ぜた状態で表示。
http://www.harvard.edu/
上記サイトの下部のようにブロックのカラーレベルやデザインである程度の区別が付けられればと考えています。
ヘッダ部は
http://www.ryukoku.ac.jp/
http://couchdb.apache.org/
http://www.inboxwarriors.com/
の最上部のようにロゴ・メニュー領域のスクロール時固定を想定しています。
初期のヘッダ領域の高さがある程度あるならば、
http://www.vogue.co.uk/
の動作のようにヘッダ部の高さを縮める動作を考えています。

http://www.siyelo.com/
初期の高さの抑制のため、KVの上にメニューその他を載せてしまい、スクロール時に見栄えを変化させる形でも良いと思います。

★フラット、知的な感じの中に多少の遊び心、明るさがあると良いと思います。フラットながら手抜き間を感じさせないよう、細かな部分のディテールなどを工夫して欲しいです。
あくまでも雰囲気ですが、
http://www.uppbroadgatepark.com/
http://home.hiroshima-u.ac.jp/aims/ （他大学同事業）
画像要素の作り込み、追加が必須にならず、一定のパターンと文字のみで更新を続けられるのが理想です。

★スケルトンのメニュー
Outline
Messages
Staff
About AIMS
Programs
Contact
の"About AIMIS"を"Inbound"と"Outbound"に分けることにしました。
日本への留学、海外への留学という意味になります。

★RWD時の対応はオプションなので、PC用イメージがRWDに対応しやすそうなイメージであり、どのような処理にするか技法の提案のみでも構いません。

参考イメージに追加です。
http://www.tmu.ac.jp/english/index.html
この程度のボリュームの内容。このサイトのお知らせ記事と右側のバナーブロックをまぜこぜで同じ形のブロック状にして並べる。但し、お知らせイメージとそれ以外の要素の区別が付くように（カラーリングやバリエーションの数は確定していませんが、多くても5つ程度だと思います。カラーの追加のみでバリエーションを増やせるといった形が使いやすいです）。
先の追記と合わせて大体の想定イメージですが、最終選定はクライアント様になります。想定イメージを越えるような工夫、または違う形でも合理的な必然性があれば選定の可能性が高いと思います。

応募が少ないため延長しました。
当選報酬も若干ですが上乗せいたします。スケジュールについて少し厳しく記述しましたが、コンスタントに1日1回以上、必ずご連絡頂ける方ならば問題ありません。

応募が少ないため延長しました。
当選報酬も若干ですが上乗せいたします。スケジュールについて少し厳しく記述しましたが、コンスタントに1日1回以上、必ずご連絡頂ける方ならば問題ありません。

いくつもご提案を頂きありがとうございます。
スケルトンと追加のご説明の影響もあるかと思いますが、近いイメージのご提案が続いており、その中で選ぶとすればクライアント様の意向もある程度固まっているようです。
多少異なる感じのご提案を頂いた方が可能性があるかと思います。

引き続きよろしくお願いいたします。

ランサーズのシステムで自動表記されている「募集期間終了後に、弊社の希望するイメージに近い提案を1つ（場合によって複数）当選させて頂きます。希望に近づけるために、場合によって当選候補者様に修正要望をさせて頂くことがありますが、何卒ご了承ください」の件についてです。
コンペ費用も出ない中、複数の方のお手を煩わせることは本意では無いため、まずはご提案頂いたイメージのまま当選を決定いたします。
この当選者の方のみに最終的なロゴやサイト名、その他の調整をお願いする形になります。
その後のスライスや細かな調整などは可能な範囲で弊社にて行うようにいたしますが、どうしてもオリジナル画像から手を入れる必要がある部分がでた場合はご対応をお願いするケースもあるかと思います。
この作業は来週6/30～7/10ぐらいの間に集中して発生する予定です。
その際はご対応よろしくお願いいたします。

この度は素晴らしいご提案、ありがとうございました。

クライアント内での選定を終え、選定されたご提案者様には個別にご連絡をしております。個別のご連絡がないご提案者様につきましては、今回は残念ながら選外と言うことにさせて頂きました。クライアントサイドの選定結果につきましてはランサーズのお気に入りの点数として3位まで設定いたしました。今後の参考となりましたら幸いです。

個人的な印象としてスケルトン、またこちらの説明などから想定していたイメージに近いものが、結果的に1位、2位となりました。現在、同じようなスケルトンイメージの別案件も募集しておりますので、参考にして頂けますと幸いです。

なお、採用予定の方の修正作業が全て完了した次点でシステム上の確定を行う予定ですので、しばらく選定中のままになりますがご了承ください。
それでは、またの機会がありましたらよろしくお願いいたします。

■ 選んだ理由

最終クライアント担当者の複数投票によるため、具体的な選定理由を挙げることが難しいのですが、基本的な色使い、欧米圏大学サイトに近い雰囲気などがあるかと思います。次点になったご提案については、推測ですが、選定案と近いご提案が多い中、大きく方向性の違う雰囲気なので複数選定とした場合に対局として選ばれやすかったのではないかと思います（他の案件でも似た傾向があります）。

■ 提案者全員のお礼・コメント

この度は沢山の質の高いご提案を頂き、ありがとうございました。
また機会がありましたら、よろしくお願いいたします。

添付ファイル

※ 締切後、添付ファイルはクライアントと当選したランサー以外は閲覧できません

• AIMSスケルトン.pdf