実装だけでなく、納品までをやる
LP制作から始まり、ECサイトの改修、業務アプリのモック、データ基盤まで担当が広がりました。 どれも社外のお客様がいる仕事で、実装 → 社内レビュー → 先方確認 → 修正 → 納品 という流れを自分の手で回しています。
担当した案件
6月以降に担当した社外案件です。業種もつくるものもばらばらですが、共通しているのは相手がいて、締切があって、確認を受けて納めるという点でした。
| 時期 | 案件 | やったこと |
|---|---|---|
| 6月 | LP制作 レジャー施設運営企業 | レスポンシブ実装・納品まで一通り |
| 6月 | 業務ツールの調査レポート 印刷事業の大手企業 | AIアシスタント無料版の機能・制限を検証し報告書化 |
| 8月 | 助成金申請アプリのモック 共済事業を行う団体 | Excel運用をアプリに置き換えた体感モックを構築 |
| 9月 〜 | 業務フロー自動化システム レジャー施設運営企業グループ | 要件定義から運用手順まで（詳細ページ） |
| 9月 〜 | Google Workspace 立ち上げ 製造業 | 導入作業と運用サポート |
| 9月 〜 | BIダッシュボードの基盤構築 旅行事業者 | BigQuery でのデータ基盤づくり |
| 10月 〜 | ECサイト TOPページ改修 住宅設備のEC事業者 | CMSに貼るブロック4種を制作 |
| 10月 〜 | LPへのクーポンバナー実装 同上 | 既存LP2本への差し込みコードを作成 |
| 10月 〜 | ECサイトのリプレイス 酒類のEC事業者 | 進行中 |
LP制作 ─ 納品までの3週間
最初に任された社外案件です。実装だけを渡されるのではなく、納品までの工程をひととおり担当しました。
- 01実装6/1〜10 ─ PC・スマホ両対応のレスポンシブ実装
- 02社内レビュー6/11〜12 ─ 社内で見てもらい指摘を受ける
- 03修正6/15〜17
- 04先方確認6/18〜19 ─ お客様に見ていただく
- 05フィードバック対応・納品6/22〜23
スマホ版のUIを別に作り、CSSのカラーパレットを整理して色の指定を一箇所にまとめました。複数のブラウザで表示を確認し、外部リンクの a タグにはセキュリティ上の対策も入れています。また、お客様の環境でファイルを開いてすぐ確認できるよう、CSSを外部ファイルにせずHTMLに直接書き込んだ版も用意しました。技術的な正しさより、受け取った人がすぐ見られることを優先した判断です。
ECサイトの改修 ─ 渡したあとに困らない形で渡す
住宅設備を扱うEC事業者のTOPページを改修しました。先方のCMSに貼り付けて使うため、こちらが納めるのは「そのまま貼れるHTML」です。自分の手で本番に反映するわけではない、という前提が設計を決めました。
- 各ブロックは
<html>や<body>を含まない、そのまま貼れる形にした - 差し替えが必要な箇所は
【要差し替え】という目印とコメントで明示し、貼る人が迷わないようにした - 画像版とテキスト版の両方を用意し、素材が揃っていなくても進められるようにした
- 既存のCSSと衝突する見出しのスタイルを特定し、打ち消して上書きする形で解決した
- クライアントから受け取った資料は、Gitに含めないよう切り分けた
画像の受領状況（受領済み・未受領）も一覧にして管理しました。「まだ来ていない素材がどれか」が自分にしかわからない状態だと、引き継いだ人が止まってしまうからです。
気づいたことは、作る前に言う
同じEC事業者の案件で、既存のLP2本に割引クーポンのバナーを入れる依頼がありました。実装自体は難しくありません。ただ、対象ページを確認していて引っかかったことがあります。
片方のLPは「ガスコンロ」のページなのに、バナーの内容は「給湯器の割引」でした。コンロを見に来た人には、使えるクーポンだと誤解されるか、無関係な広告に見えてしまいます。
実装前に出した確認事項よりそこで実装を進める前に、このLPに載せてよいかを確認事項として上げました。載せない判断になれば、そちらのコードは使わない前提です。言われたとおりに両方へ入れることもできましたが、それだと「指示どおりに作った」だけで、結果的にお客様の不利益になります。
あわせて、リンクを付けるかどうかでパターンを2つ用意し、掲載終了後に削除する箇所がひと目でわかるようコメントで囲むようにしました。期限のある施策なので、消すときのことまで決めておく必要があります。
助成金申請アプリのモック ─ 何を作らないかを決める
共済事業を行う団体向けに、Excel中心で回っている助成金の申請・審査業務を、アプリに置き換えたらどうなるかを体感できるモックとして作りました。
- 団体がサンプルExcelをダウンロード → 記入 → アップロードして申請する流れ
- 届いた申請を事務局が一覧で管理する流れ
- 過去の助成実績をもとに条件審査を自動判定する流れ
- 複数の審査委員が採点し、その進捗が一覧で見える流れ
意識したのは範囲を決めることでした。認証・監査・可用性といった本番運用に必要な設計は、今回の目的（検討材料として触ってもらう）には不要です。そこで認証は実装せず、画面右上で「いまどの立場で見ているか」を切り替える形にして、そのことをドキュメントにも明記しました。作らなかったものを曖昧にすると、モックが本番と誤解されます。
Excelの入出力を残したのも意図があります。いきなり全部を新しい仕組みに置き換えるより、いま使っているものと地続きにしたほうが受け入れられると考えました。
調査と資料作成
手を動かす仕事以外に、調べてまとめる仕事も担当しました。
- AIアシスタント無料版の業務活用調査 ─ 機能・回数制限・他ツールとの連携・Officeとの組み合わせを実際に試し、報告書にまとめて納品
- 技術調査とアーキテクチャ図の作成 ─ IPアドレス制限の可否、外部ストレージを使わない場合の懸念、監査目的でのログ管理の方法を整理してスライドに反映
- 提案資料のフォーマット整備 ─ 社内の提案資料を規定フォーマットに揃える仕組みづくり
- 社内向けの初学者向け資料の作成
学んだこと
社内で使うものと、社外に納めるものはやはり違いました。締切があり、レビューがあり、先方の反応があり、そこから直して納めるという流れの中では、「動いている」だけでは何も終わっていません。
そして、納めたあとに触るのは自分ではない、ということを何度も意識しました。貼り付ける人のための目印、削除するときのためのコメント、素材の受領状況の一覧 ── どれも自分がいなくなったあとに困らないかという視点から出てきたものです。
高校のときにWebコンテストで企業5社に取材を申し込んで、断られながら文面を直していったことがありました。相手がいる仕事は、こちらの都合では進まない。あのときの感覚が、そのまま仕事の形で戻ってきたと感じています。