afforplus

Webポートフォリオです。

制作したWebサイト、企画、紙媒体の作品を載せています。
キーボードの ← → で移動します。また、下部にある ● でページ移動します。

最終更新:2012年2月20日

阪神北広域子ども急病センター

Webサイトのリニューアル

救急センターのWebサイトのリニューアルをプレゼミ生6人で制作しました。

新しい取り組みとして、Twitterと連携した小さい子どもをもつ親御さん方の交流の場としての母親交流や、今まで行われていた電話相談の多い内容をネット上へ公開することによって、同じ内容で困ってる方や、電話して良いのか迷ってる方のハードルを下げることを目的にしました。

平成23年度 春の造形展金賞受賞作品

コンセプト

色合いは子どもをイメージしやすい配色を使用し、トップに依頼されたFlashアニメーションで看護師と子ども、母親の暖かい空間をイメージした。

担当
HTML
CSS
jQuery
デザイン
企画
課題
制作人数
6人(チームリーダー)
制作期間
約10ヶ月
使用ソフト
Photoshop
Coda
URL
http://www.hanshink-kodomoqq.jp/index.html
トップページ トップページ トップページ

『ジュウク展』

グループ展の告知サイトの制作

京都精華大学2回生5人(19歳)による展示会の特設サイト

コンセプト

グループ展の告知サイトと言うことで、一般的なWebサイトの作り方をやめて、横へスクロールしていくページ構成にしました。外出先からも確認できるように、iPhone、iPadに対応させました。

担当
HTML
CSS
jQuery
デザイン
企画
課題
制作人数
3人
制作期間
約2ヶ月
使用ソフト
Photoshop
Coda
URL
http://19ten.hariko.com/
トップページ メンバーページ アクセスページ iPhone対応アクセスページ iPhone対応メンバーページ

『ooxxo』

個人ポートフォリオサイト

京都精華大学イラストレーションコース生のいわしたなつきさんの個人ギャラリーサイトを制作しました。

コンセプト

できるかぎりシンプルなもの。と希望を頂いたので、白を基調にレイアウトしていきました。メニューではできるだけ強調しないように、小さめに配置しましたが、メニューとわかるように上下にラインを入れたり、hoverで色が変わるようにしました。また使用するフォントはサイトと合うようにgoogleapiのfontのJosefinSansを使用しました。

担当
HTML
CSS
jQuery
デザイン
企画
課題
制作人数
1人
制作期間
約1ヶ月
使用ソフト
Coda
URL
http://ooxxo.web.fc2.com
ギャラリーページ ギャラリーページ 写真ページ ブログページ

地デジって?

授業制作課題

平成21年度春の造形展金賞受賞作品

コンセプト

ターゲットは中学1年(13歳)男の子。今見ているアナログ放送からデジタル放送に移行するに当たり、今見ているテレビがどう変化するのか、またなんで変えるのか?などの疑問を解消するためのサイト。ロゴが回転したり、リンクが動いたり、飛行機が飛んだりとギミックを使用することによって、おもしろく描いている。背景に東京タワーとスカイツリーを使用することによって、高さの差やただの観光地ではなく、電波塔としての役割を果たしているところにも気付いて欲しいと設置しました。

担当
HTML
CSS
jQuery
デザイン
企画
課題
制作人数
1人
制作期間
約2週間
使用ソフト
Photoshop
Illustrator
Coda
URL
http://afforplus.com/work/dtv
トップページ 地デジって? Q&Aページ 切り取り線

PRAY

授業制作課題

コンセプト

Googleの特設サイトである『未来へのキオク』のコンテンツのひとつであるGoogleストリートビューを使用した映像を制作しました。車窓から眺めている風景とし、ストリートビューを使用し、繋ぎ合わせました。モノクロな映像を過去、カラーの映像を現在とし、同じ場所の風景が変わったことが容易にわかるようにし、震災の影響がすさまじいものをわかるようにした。

担当
HTML
CSS
jQuery
デザイン
企画
課題
制作人数
1人
制作期間
約2週間
使用ソフト
Photoshop
AfterEffect
Coda
URL
http://afforplus.com/work/pray
トップページ 亘理町 shinehi

Processing

授業制作課題

iTunesのビジュアライザでも使用されているProcessingを使って、プログラムアート作品を制作しました。

コンセプト

【[Z]=背景を白色に [X]=背景を黒色に [C]=背景をランダム色に】などといった動作をします。
GAINER miniと言う機械を使用し、センサーからコンピュータへ、コンピュータからセンサーへの制御をする仕組みを使い、ミニゲームを製作しました。

(画像のリンク先を動作するページへ飛ぶように変更中)

担当
HTML
CSS
プログラム
デザイン
企画
課題
制作人数
1人〜3人
制作期間
約6ヶ月
使用ソフト
Processing
GAINER mini
ActionScript
URL
http://afforplus.com/work/processing
abc abc abc abc

携帯コンテンツ企画

iPhoneを使ったアプリの企画を制作しました。

コンセプト

ゲーム離れできない子どもに対して、電子ゲームと外で遊ぶことの間を取った陣取りゲーム。
iPhoneや携帯についているGPSとGoogleMapを使いボードゲームの陣取りゲームをリアルに歩いて獲得する対戦ゲーム。

担当
HTML
CSS
jQuery
デザイン
企画
課題
制作人数
1人
制作期間
約1週間(2010年1月)
使用ソフト
Photoshop
URL
企画書PDF
トップ画面 設定画面 play

デザインマネジメント企画

Webを使用した企画

コンセプト

募金するには普段、コンビニのレジ横や、街頭、サイトなどだが、なんだか信用できないような気がした。寄付サイトでは、更新頻度は低く、寄付した後どうなったかが予想しづらいと思いました。 そのため、寄付するにあたり、寄付したお金がどうなったかわかる様に写真や動画コンテンツを増やし、SNSで直接相手との交流を図る。直接交流を図る事によって、この人に対して何かしてあげたいと 言う気持ちが増えるのではないかと考えました。

担当
HTML
CSS
jQuery
デザイン
企画
課題
制作人数
1人
制作期間
約2週間(2012年1月)
使用ソフト
Illustrator
URL
企画書PDF
トップ画面 設定画面 play

高校文化祭アンケート用紙

幟のデザインアンケート

コンセプト

アンケート回収率が1年目はとても悪かった。2年目にアンケート回収率あげるため、わかりやすいゲーム方式で景品付きで行いました。アンケート回収が目的のため、スタンプを3つまでとしました。

担当
HTML
CSS
jQuery
デザイン
企画
課題
制作人数
2人
制作期間
約1週間(2008年、2009年)
使用ソフト
Illustrator
URL
アンケートPDF
トップ画面 設定画面 play

SkyPola

平成24年度 春の造形展 銀賞受賞作品

コンセプト

大学から見える景色を、その日の活動が終わり始める夕方から動き始める朝方までをインターバル撮影しWebサイト上にポラロイド風に展示しました。 映像自体に集中できるように文字などは極力減らし、作品のコンセプトなどはcss3を使用し、hoverすると画面端からメモが出てくる仕掛けを使用しました。

担当
HTML
CSS
jQuery
デザイン
企画
課題
制作人数
1人
制作期間
約1週間(2012年)
使用ソフト
After Effect、Coda、Photoshop
URL
SkyPola
トップ画面 トップ画面

夏うたベスト100

平成21年度 夏の造形展 佳作受賞作品

コンセプト

ベスト100シリーズの夏版。夏に聴きたくなる・夏に合う曲を100曲収録。
このシリーズはたくさんあると想定して、ベスト100シリーズとすぐわかるように中央に大きく文字を配置しました。ジャケットの背景は波をイメージしました。レーベルは風鈴の模様をイメージし回転した時にきれいに見えるように考えました。

担当
HTML
CSS
jQuery
デザイン
企画
課題
制作人数
1人
制作期間
約1週間(2009年)
使用ソフト
Photoshop、Illustrator
URL
サマーベスト100 サマーベスト100中 Rain

akportfolio

ポートフォリオサイトの依頼

コンセプト

イラストや似顔絵、マンガなどを描いている
金沢明信君のポートフォリオサイトの制作。
すてきな色合いのペンギンが居ることから、雰囲気を壊さないように背景に薄いテクスチャや色合い、柔らかい雰囲気にするよう気をつけました。

担当
HTML
CSS
jQuery
デザイン
企画
課題
制作人数
2人
制作期間
約2週間(2012年)
使用ソフト
Photoshop, Coda2,
URL
akportfolioサイト
top gallery

スタモ

iPhoneアプリ / 卒業制作奨励賞 受賞作品

コンセプト

「1画面目に残るアプリ」を目標に制作を行いました。
 ユーザーのスターバックスコーヒーのカスタマイズを補助し、オリジナルなカスタマイズを発見。 それをSNS上で共有することによって、みんなでおいしいカスタマイズを発見しようとするのがこのアプリの特徴です。 スターバックスコーヒーとネット上のフォースプレイス(第4の空間)を繋ぐアプリです。
 ハイブリッドアプリとして作成することによって、季節限定の商品の追加や値段の変更などに対して最新の情報を届ける事ができます。


iBooks Authorでの説明はこちら
stamo.ibooksをダウンロード

担当
HTML
CSS
jQuery
デザイン
企画
課題
制作人数
2人
制作期間
約2週間(2012年)
使用ソフト
Photoshop, Illustrator, Coda2
URL
スタモサイト
top ss1 ss1 ss1 ss1 site1 site2