05. apex funlegend
作品概要 #
制作意図は、HTMLやCSS、JavaScriptを使用できることを知ってもらいたいことと、初級者から中級者までの人に参考になるサイトを作りたかったことです。
目的に関しては初心者にはキャラクターの名前、そのキャラのストーリーを閲覧してもらい、中級者には戦術の所でそのキャラクターのアビリティ使い方などを学んでもらいつつ新しい情報を知ってもらい、最終的には上級者もこのサイトで閲覧して学んでもらえるようなものを作りたいです。
プレゼンテーション動画 #
アピールポイント #
キャラクターの概要、戦術についてはそのキャラについてこと細かく記載しました。
そこで分からないところに関しては上の３つの画像のうちどれか１つをクリックすることにより公式サイトに飛ぶのでそこでも閲覧が可能です。
文ばかりで飽きないよう、丁度いいタイミングのところにそのキャラにあった画像を配置。見やすいよう文字を枠の中に置くことにより一つ一つの枠の文、画像で差別化しています。
戦術のところはGIF画像を使用することにより、そのキャラがどんな動きでどういうふうに使うかなどが分かりやすくなっています。
情報のところは海外のアメコミ漫画の１ページのような枠を作り、そこの一コマ一コマにその記事の名前、画像を貼っています。
制作者感想 #
作り始める前は自分の技量不足で作りたものが作れず、内心諦めかけていたのですが日々色々なサイトを閲覧して面白そうなものはソースコードを見て作り方を学び、アニメーションなどに関してはたくさんの方々が色々なCSSなど使ったものを作っているサイトを閲覧してはそこにあるものを自分のサイトにとどまるよう調整などをした結果、現在のようなサイトを作ることが出来ました。
ですが、正直今の段階では満足しておらず、まだまだ改善の余地がたくさんあると思うのでこれからどんどん色々なものを入れて行こうと思っています。
例えば現在上のバナーが普通に「戦術」と他２つが並んでおりますがそこにマウスカーソルが触れた際、段々と元の色から赤色に変化していくなどを入れていく予定です。
- 次の作品: 初心者の自動生成サイト
- 前の作品: 島村囲碁クラブ
コメント #
作品ならびにプレゼン動画の閲覧ありがとうございました。
さらに学生作品への評価・アドバイス、感想などコメントいただけると、今後の制作、就職活動の励みになります。よろしくお願いいたします。