2016.10.25

ベトナムでのオフショア開発(業務改善編:詳細)

おさらいですが、前回渡航した際
「品質を向上させる!」を目的に下記5項目に注力してまいりました。

  1. 弊社の理念と今後の展望を改めて共有
  2. スタッフと個人面談・制作環境の確認
  3. どういった課題をクリアしないといけないのか?具体例をあげて全て説明
  4. 技術レクチャー
  5. 弊社で準備している検品書(品質チェックシート)の内容をあらためて説明

今回は、オフショア開発の現場でおこなってきた内容の詳細をお伝えいたします。

1.弊社の理念と今後の展望を改めて共有

弊社の熱量を含めたかったので、社長の声をそのまま伝えようと考えました。
この提案に社長・上長からの快諾を得て動画に翻訳を載せ作成しました。
みなさん、真剣に聞いてくれていました。
動画を見終わった後、スタッフは笑顔で、「OK!」といってくれたので思いは伝わったかと思います。
そういえば、以前社長が言葉に言霊が宿るということをおっしゃっていました。
言霊がいい形に消化されればいいなと願います。

k-v1

理念に関しては弊社自社サイトにてご確認ください。

2.スタッフと個人面談・制作環境の確認

個人面談

コミュニケーションをとるのが目的でした。
個人を知ることで課題も具体的に見えてくるのではないかと考えています。

ヒアリングとして有益だったのは以下3点です。
改善ポイントが明白になりました。

■AQUARING・オフショア開発 [T君]の指示で良い点・悪い点を教えてください。
ほとんどのスタッフが問題ないと回答した中、数人のスタッフからは具体的な改善を求める声をいただきました。

■今後仕事面でどういう人になっていきたい?
意外にも多数がマネージャーになりたいという声でした。その上で自分を客観的にみていて短所(具体的にあげてくれました)を克服していきたいという声もあがりました。

■勉強をしているとしたら、目的をもってしていますか?
スピードをアップしたい。CSSアニメーションでものをつくりたい。WordPressなどのCMS案件もチャレンジしたいなど全員が意見がかぶらなかった項目でした。

現状に満足せず、次に向かう姿勢・意欲の高さを感じました。

制作環境の確認

PCのスペックが制作スピードに直結することもあるので、以下2点の見直しを図りました。

  • 各PCのメモリ増設
  • 検証機の導入

※各スタッフのPCにいれていたVirtualBox(エミュレータ)により速度が落ちていたので検証機を別に準備しました。

■PC端末
Windowsマシン(Windows 10)

  • IE6, IE7, IE8, IE9, IE10, IE11(VirtualBox)
  • Android(エミュレータ): 4.1, 4.2, 4.4, 5.0, 5.1, 6.0
  • Chrome (最新), Firefox (最新), Opera (最新)

MacBook Pro

■モバイル端末

  • Android実機(OS4.4)
  • iPhone6

これにより、以前より品質の向上/課題の早期発見が期待できます。

k-v2-0

3.どういった課題をクリアしないといけないのか?具体例をあげて全て説明

テキスト関連

■コピー&ペーストの徹底
文言入力を手入力でいれてしまうことで微妙にことなる日本語(表記・漢字)がはいっており弊社側でもミスに気づきにくい状態になっていた。
例:(表記)◯:2015年11月 x:2015年 11月 / (漢字)◯:思い x:想い

■img要素のalt属性が入力間違い
コピー&ペーストの徹底とかぶりますが、こちらも手入力をさせるためにかならずレイヤー(アセット)名をコピペすることにさせました。

バリデート(構文エラーチェック)の徹底

■バリデートをかければわかるレベルのマークアップのミスはさせないように細かい周期でバリデートをかける癖をつけるようにレクチャー。
例:<h2>XXXX</h3>
になっていて、間違っていることを気づかず量産していた。

■文書構造への理解
H1の次にH6がきていたりしていて構造が理解できていなかった。見た目を表す時はclassを変更し、構造はHTMLで定義するように説明。

■仕様に沿っていない(HTML4でdiv要素をa要素で包括している。)※HTML5ではOK
指示に忠実にあわせるように伝える。こちらもバリデートの徹底をおこなっていれば解決できる課題である。

チームで制作するときの留意点

■命名ルールが間違っている/個人ルールになっている
例:アイコンを表現する接頭辞がico,icnだったり2パターンある / リンク先は指示がなければ「#」にするというルールに関わらず「*」になっていたりする。

■CSSに同じクラス定義が複数あって削除されていない
複数人で作業をおこなったが故におこった課題。修正作業をおこなった際に気づいたのだが、ものすごく修正に時間がかかってしまったので、最終チェック時にきちんと汎用性があるかどうか?修正対応が最低限でおこなえるように整理されているか?を確認するように伝える。

■同じモジュールを作業者をわけて作成することで、マークアップ、命名ルールがバラバラで帰ってくる
汎用テンプレートと量産の認識をStyleGuideを元に説明 / 汎用テンプレート→確認→FIX→量産の流れを徹底してもらう。

その他留意点

■デザイン通りにコーディングをおこなう
汎用クラス(mb10)などを使用することでスピードは向上するが、品質がさがるのでこれら汎用クラスを極力使用せず、+-5px以内で合わせてもらうように指示しました。PSDとの差異を確認する方法も合わせてレクチャーしてきました。

■不要リソース削除を徹底
ダミーファイル・指示/デザインが変更になったことで使用しなくなった画像、CSSなどを削除せず残していたので作業ファイルは常に本番公開を意識した状態を保つべきだということを伝え最終チェック項目に追加し不要リソース削除を徹底させています。

k-v2-4

 

4.技術レクチャー

エクセル(マクロ)をつかったHTMLの量産方法をレクチャーしました。
パターンを整理すれば、数百/数千ページにも対応可能です。
これにより制作コストの削減が大きく期待できます。
実際、翌週に控えていた量産案件で見込んだ工数の半分で作業を終えることができました。

5.弊社で準備している検品書(品質チェックシート)の内容をあらためて説明

53項目をあらためて説明しました。
その場で不明点・改善点も拾い上げ解決することで、項目が終わる頃にはわからない箇所はない状態でした。
根気よく丁寧に伝えることでこちらの熱量、最終チェックの重要性を感じてくれたとおもいます。

説明をおこなったことで、理解にずれがあった箇所も起動修正でき有益でした。

business

まとめ

「品質を向上させる!」を目的に渡航した今回のプロジェクトですが、
数ヶ月たった今成果として出始めている状態です。

ですが、コミュニケーションをとらなければ当時の熱量も冷めてきます。
何度も何度も同じことを言い続ける根気が必要だなと感じています。

日々課題はでてくるので、常に改善し根気よく伝えていきたいと思います。
同じくオフショア開発を導入されているかたにとって少しでもお役にたつ記事であることを願います。

うちではこんなことしてるよ!色々意見交換しない?
などご意見・ご感想受付中です!

お問い合わせはこちらから。

お問い合わせ

k-v2-3
※この中に日本人が1人います。