読者です 読者をやめる 読者になる 読者になる

0から学ぶIT技術

ローカルのドキュメント載せたり、IT関連の催し物の参加報告

ホームページ制作しています!まとめ

HTML

f:id:naro3:20170127014518j:plain
こんにちは。
今回は「ホームページ制作しています!」のまとめ記事となります。
初仕事であり、初のチーム作業でもありました。
メンバーの紹介や今後のお知らせなども執筆していきます。

きっかけ

高校の時の友達にたまたまITの専門学校に通っていると言った際に、依頼されました。
本当に偶然です。

依頼されたときの状況

  • メンバーどうする?
  • フロントエンド触ったことない!
  • サーバーも借りたこともない!
  • 写真やったことない!
  • デザインもやったことない!

という本当にド素人。
しかも、SECCONという大会間近のためそこそこ忙しかった時期でした。
しかし、いいきっかけ、好機だと思いやってみることにしました。

やったこと

  • メンバー選び。
  • クライアントさんとの面談。
  • 方針決定。
  • ヒアリング。
  • デザインの決定、仕事割り振り。
  • 開発、実装。

の6ステップです。
順に詳しく書いていきます。

メンバー選び

以前参加したMBSDというセキュリティの大会のときのメンバーをそのまま採用しました。
Aさん 器用、ツールや時間管理がすごくうまい。
Bさん マスコット、絵が書ける。
Cさん ムードメーカー、意外な発想をするアイデアマン。
こんな感じです(笑)。

クライアントさんとの面談

以前から面識のある方だったので、緊張はしていませんでしたが、ここである衝撃を受けます。
それまでは今回の仕事は、平均的なつまり「「見せるホームページ」を作れればいいな」と考えてましたが、初めてクライアントさんと話に行った際に本当に楽しみにしていること、その笑顔を見た瞬間に「僕達に頼んだことを誇れるような「売れるホームページ」を作ってやる!」と意識が変わりました。
この際にイメージやお店の「弱み」「強み」「脅威(競合)」「好機」いわゆる「SWOT分析」、お金のこと、こちらのメンバー構成を話し合いました。

方針決定

このステップは調べたりしながら、じっくり考えました。
結果、初のグループ作業であることもあり、完成図を共有することは難しいのではないかと考え、メンバー全員が各々TOPページの型だけ作ってきて、クライアントさんにプレゼンするという形を取りました。
この時点で納品日まで1ヶ月ほどでした。

ヒアリング

これは私個人での活動で、私は人から話を聞くことで経験がないことの補完をしようとしました。また、人を指揮するということについても、いろんな方にアドバイスをいただきました。
冬休みに入ったこともあり、Twitterなどで接触し、週に一人などのペースで会っていただきました。
この際にお話をした方たちが後々自分にとってキーパーソンになります。
ネットでホームページやデザインをひたすらに見始めたのもこの時期からです。
また、この時点でメンバーCが資格試験の1次免除に落ちたため離脱しました。

デザインの決定

冬休みが終わり登校した際に全員のトップページを確認しました。
3人とも見事に型が違うもので楽しかったです。

自分 ナビゲーションとドロップダウンメニューでページ遷移するもの
f:id:naro3:20170127075855j:plain

メンバーA 同一ページ内でスムーズスクロールするもの
f:id:naro3:20170127075907j:plain

メンバーB 写真を全面に押し出したタイル型
f:id:naro3:20170127075915j:plain

クライアントさんに、実際に同じ型で他の企業が実装しているものと見せ、デザインを選んでもらいました。
今回はスマホ中心にすることもあり、メンバーAのデザインが選ばれました。
このときで納品日まで1週間でした。
思った以上にデザインに時間を取られ、焦りが生まれてました。
サーバもこの時期に借りました。

仕事の割り振り

自分 クライアントさんとの連絡、コード、統括。
メンバーA SEO、埋め込み要素。
メンバーB 写真加工、ロゴ作成。

これはすぐに決まりました。

開発実装

自分は、初めの3日で枠組みを作り、中の2日でレスポンシブデザインにして、残りはデザインに悩みました。
また、メンバーBにクライアントから送られてきた画像を送り、加工の指示をだし、メンバーAにコードを送り、変更があったり、送られてきたコードを反映させるのが仕事でした。
この1週間はメンバーも遅くまで作業をしてくれ、倒れないか心配で「休んで!」と言った次の朝にブラウザごとの動作をまとめてくれていたり、本当に助かりました。
実装できたのは本当にメンバーのおかげです。
デザインは実装の1時間前まで悩みました。

感想

今回は初仕事、初チーム作業、フロントエンドはHTMLの勉強からという先の見えないプロジェクトについてきてくれ、惜しみなく時間を使って作業してくれたメンバーに感謝しかないです。
反省点としては、フレームワークを作らずに開発をしてしまったため、無駄なコーディングや、デザインに時間を取られてしまったりしたところです。
また、写真やデザインに関しては特に改善が必要だとも感じました。
が、いいものができたと思っています。
個人としては、メンバーの作業を楽にするための管理、綺麗なコーディングが今後の課題です。
本当に大変でしたが、楽しくとてもいい経験でした。
今後は細かいバグなどを直しなから管理をしていきます。

最後に

今回の仕事を通してのヒアリングの際に、協力してくれる方ができたり、次の仕事が決まったりしました。そのため税金などの関係で開業をすることになりました。今後は事業の記事は別のブログで執筆する予定ですので、進捗がありましたら連絡しますので、よろしくお願いします。
また、ITの世界に入り1年経たずに開業をした経緯も執筆予定ですのでよろしくお願いいたします。