87
小さな会社向けの WordPressサイトの 製作ワークフロー 2013/07/27 岡本直美 @nekomimiTaicho

Word benchしずおか20130727

Embed Size (px)

Citation preview

Page 1: Word benchしずおか20130727

小さな会社向けのWordPressサイトの製作ワークフロー2013/07/27 岡本直美 @nekomimiTaicho

Page 2: Word benchしずおか20130727

6/23のWordBench大阪に参加された皆様

おまっとさんでした。と、言わせてください。

Page 3: Word benchしずおか20130727

自己紹介

• 岡本直美(ねこみみ隊長)•会社員エンジニアしてます•個人では、ねこみみすくーる開講

Page 4: Word benchしずおか20130727

自己紹介

•べんちばメンバー•ぼけっち三姉妹の次女•Word主婦のひとり

Page 5: Word benchしずおか20130727

what’s べんちば?

Page 6: Word benchしずおか20130727

べんちばの紹介。

Page 7: Word benchしずおか20130727
Page 8: Word benchしずおか20130727

WordBench千葉• 千葉で•定期的にやりたい•少人数で•ハンズオン•アンカンファレンス

Page 9: Word benchしずおか20130727
Page 10: Word benchしずおか20130727

WordBench千葉• PHP基礎•パーマリンク•テーマことはじめ• BookPress• DBと引っ越し・・・などなど

Page 11: Word benchしずおか20130727
Page 12: Word benchしずおか20130727

・・・and

Page 13: Word benchしずおか20130727

what’s ぼけっち?

Page 14: Word benchしずおか20130727

ぼけっち(bokettch)とはWordBench千葉でいっしょに活動してるうぇぶるじょんさん(@Webourgeon_com)のこと。あるいはその天然なおっちょこちょいな行動の総称をいう。特にじょんさんに認定されたぼけっちーずは番号が振られている。(例:隊長は、ぼけっち28号)なお、最近ではその様子をヲチるための「ぼけっち録」というサイトが存在し、プラグイン作者として有名な大曲 仁氏ご自身のサイトよりもPVが多いという。

※ nekomimi-taicho.com より引用

Page 15: Word benchしずおか20130727

Stop the Bokettch?

Page 16: Word benchしずおか20130727

Stop the Bokettch とはWordCamp KOBE 2013 に登壇されていた大串 肇氏が「検索インデックスのチェックボックスを外すのを忘れてしまう」と言うあるある失敗談をしていて、それを聞いた大曲氏が昼休み中に作成したというプラグイン。

非常にシンプルで役立つプラグインではあるが、会社内で名称をいうのをためらわれたり、海外で「ぼけっち」の概念を説明するのが非常に困難という不思議なプラグインである。

Page 17: Word benchしずおか20130727

のちほど本人からの

解説もあるでしょう・・・

Page 18: Word benchしずおか20130727

what’s Word主婦?

Page 19: Word benchしずおか20130727

Word主婦(Word Shufu)とは主婦として家庭を守りながらも、WordPressコミュニティで活躍するパワフルな女性の集まる闇組織、あるいはその構成員のこと。基本情報はすべて非公開。誰でも入れるわけではないらしい。ある意味WP-Dよりディープ。

※ 構成員は全国に点在しております。

※ nekomimi-taicho.com より引用

Page 20: Word benchしずおか20130727

ということで、

Page 21: Word benchしずおか20130727

今日はべんちば出張版

Page 22: Word benchしずおか20130727

本日は、べんちばを代表するぼけっち三姉妹が

しずおか巡業にやって参りました。

Page 23: Word benchしずおか20130727

どうぞよろしくお願いします

Page 24: Word benchしずおか20130727

まずは、私がトップバッターで

Page 25: Word benchしずおか20130727

WordPressサイト制作で普段、気をつけていることをお話しようと思っています。

Page 26: Word benchしずおか20130727

Agenda?

• 弊社での私の役割•作業ワークフロー → 基本ループ•WordPressサイト制作の場合•よく使う道具、よく使うプラグイン

Page 27: Word benchしずおか20130727

ねこみみのお仕事

Page 28: Word benchしずおか20130727

弊社での私の仕事

• 現状分析や事前調査•各種デザイン•構築・開発•運用

ぐるぐる繰り返します。

Page 29: Word benchしずおか20130727

これってどっかでみたことあるサイクル

Page 30: Word benchしずおか20130727

PDCAサイクル

• Plan(計画・目標)• Do(導入・運用)• Check(監視・見直し)• Action(改善・処置)

Page 31: Word benchしずおか20130727

PDCAサイクル

• 生産管理や品質管理の手法•私は、システム設計などでSE時代に使っていました。

•繰り返して行くことで品質向上

Page 32: Word benchしずおか20130727

PDCAサイクル• 最近ではいろいろなところでこのPDCAサイクルを採用しています

•繰り返し見直しが必要なプロジェクト• webサイト制作• CMSやwebアプリ開発

Page 33: Word benchしずおか20130727

web開発では

• Plan(計画・目標)→(分析・計画)

• Do(導入・運用)→ (設計・開発)

• Check(監視・見直し) → (テスト・移行)

• Action(改善・処置) → (検証・改善)

Page 34: Word benchしずおか20130727

PDCAサイクルというだけあってぐるぐるまわります。

Page 35: Word benchしずおか20130727

作りっぱなしではなく、ぐるぐるまわって改善していきます。

Page 36: Word benchしずおか20130727

これがサイト制作の基本ループになります。

Page 37: Word benchしずおか20130727

でもそれって小さな会社に必要?

Page 38: Word benchしずおか20130727

しかも・・・

Page 39: Word benchしずおか20130727

PDCAサイクルにあわせたドキュメント作成例

• Plan(分析・計画)→ コンテンツマップ• Do (設計・開発)→ サイト仕様書• Check (テスト・移行)→ テスト手順書• Action (検証・改善)→ 検証リスト

Page 40: Word benchしずおか20130727

え?ほんとに小さな会社に必要?

Page 41: Word benchしずおか20130727

必要な理由

• 小さい会社(あるいは個人)は融通が利きやすいと思われがち

•クライアントの変更要求の増大•先に仕様をきちんときめないとエンドレスに対応しないといけない

Page 42: Word benchしずおか20130727

_人人人人人人_ > 突然の仕様変更 < ‾Y^Y^Y^Y^Y^Y‾

Page 43: Word benchしずおか20130727

だから、工数見積りが大切。

Page 44: Word benchしずおか20130727

Word主婦でも話題•ちゃんと人月計算しないとね。•どうやって見積もりしてる?

Page 45: Word benchしずおか20130727

Word主婦でも話題•私が使ってるの、共有するので、みんなで改良しましょ!

ちょっとみてみましょ・・・

Page 46: Word benchしずおか20130727

excel...

Page 47: Word benchしずおか20130727

6/23のWordBench大阪ではちらっと見せただけで終わりましたが・・・

Page 48: Word benchしずおか20130727

nekomimi-taicho.com

許可を得て単価抜きのデータを公開。

Page 49: Word benchしずおか20130727

そして予告通りにWordBench大阪の3日後と4日後に

公開された、WP-Dの記事

Page 50: Word benchしずおか20130727
Page 51: Word benchしずおか20130727

実はこの元ネタってWord主婦からなんです。

WordPress界と深い関わりのある謎のお友達・・・

Page 52: Word benchしずおか20130727

しかも・・・

Page 53: Word benchしずおか20130727

2013/09/14のWordCampTokyo2013

なかなかネットで聞けないいろんなお話を語り合うWord主婦みたいな

参加型イベントを計画中。

Page 54: Word benchしずおか20130727

さて、話を戻すと、

Page 55: Word benchしずおか20130727

必要な理由• 正しい工数計算/見積もりの詳細性• 無理な仕様の変更は時間もお金もかかるということを数字でクライアントに理解

• ノウハウの蓄積が形に残る•結果:自分たちを守る

Page 56: Word benchしずおか20130727

必要な理由自分たちを守るため。

Page 57: Word benchしずおか20130727

WordPress構築におけるPDCAサイクルとは?

Page 58: Word benchしずおか20130727

Plan(分析・計画)WordPress構築

Page 59: Word benchしずおか20130727

Plan(分析・計画)WordPress構築

•理由もないWordPress採用は危険•ダメなら潔く捨てる覚悟で•目標設定を必ずしっかり行う

Page 60: Word benchしずおか20130727

目標設定•早く作る•かっこよくリニューアル•動的な機能を組み込みたい• SEO対策の一環•弊社の場合、運用保守しやすくなるのでCMS化をお勧めしている

なんでもいいんです。

ただ、ぶれないこと。

Page 61: Word benchしずおか20130727

• 投稿や更新をどのように誰がするのか?•本番環境の確認•どの情報を投稿にするのか?•どの情報を固定ページにするのか?

Plan(分析・計画)WordPress構築

Page 62: Word benchしずおか20130727

• サイト構成図• サイト遷移図•コンテンツマップ• ワイヤーフレームなど

Plan(分析・計画)WordPress構築

Page 63: Word benchしずおか20130727

WordPress構築では、コンテンツマップが大事。

Page 64: Word benchしずおか20130727

コンテンツマップから

投稿タイプ、タクソノミー、フィールドを選定し、

ワイヤーフレームに関連付けられたら

あとはゴリゴリ書くだけ。

Page 65: Word benchしずおか20130727

それにここの部分、ちゃんと理解し構築すればセマンティックwebへの移行もスムーズ!

Page 66: Word benchしずおか20130727

WordPressは、コンテンツマネージメント

システム・・・ですもんね。

Page 67: Word benchしずおか20130727

だからコンテンツマッピングとても大切です。

Page 68: Word benchしずおか20130727

ちなみに私がコンテンツマッピングする時の便利な道具をご紹介します。

Page 69: Word benchしずおか20130727

Excel

Page 70: Word benchしずおか20130727

付箋。消せるボールペン。

Page 71: Word benchしずおか20130727

Do (設計・構築)WordPress構築

Page 72: Word benchしずおか20130727

• 管理権限にあわせた管理画面設計• 投稿・編集者にあわせた入力設計• 必要な機能を満たすプラグインの選定

Do (設計・構築)WordPress構築

Page 73: Word benchしずおか20130727

せっかくなので私がいつも使う

プラグインを紹介します。

Page 74: Word benchしずおか20130727

•WP Total Hacks•WP SiteManager•Contact Form 7•Custom Post Type UI•Advanced Custom Fields

Do (設計・構築)WordPress構築

Page 75: Word benchしずおか20130727

プラグインの細かい話はぼけっち漫才コンビにおまかせして、

Page 76: Word benchしずおか20130727

•functions.phpに書いて出来ることもある。

•でも更新する人すべてがPHPerじゃなきゃ、プラグインを使うべき。という指針で選ぶ。

Do (設計・構築)WordPress構築

Page 77: Word benchしずおか20130727

• ガイドラインを守ったテーマの作成•セキュリティ対策•本番環境とテスト環境

Do (設計・構築)WordPress構築

Page 78: Word benchしずおか20130727

Check (テスト・移行)WordPress構築

Page 79: Word benchしずおか20130727

• テストは計画的に•あるわけない投稿や入力、表示を確認• 大丈夫だろう・・・なんてことはない。• テスト項目のチェックリストを用意

Check (テスト・移行)WordPress構築

Page 80: Word benchしずおか20130727

• 移行するときは手順書を用意•手順書は次回以降の開発のために残す•運用のためのマニュアル作成

Check (テスト・移行)WordPress構築

Page 81: Word benchしずおか20130727

Action (検証・改善)WordPress構築

Page 82: Word benchしずおか20130727

•思い通りに表示されているか?•更新しやすいか?運用しやすいか?•ひとつでも「?」が残ったらPlanに戻る

Action (検証・改善)WordPress構築

Page 83: Word benchしずおか20130727

• WordPressである必要性がなかったら、潔く捨てよ。

•せっかく作ったのに・・・はNG• 今は「StaticPress」なんていう便利なプラグインだってあるじゃないか!

Action (検証・改善)WordPress構築

Page 84: Word benchしずおか20130727

なにが言いたかったかと言うと・・・

Page 85: Word benchしずおか20130727

小さい会社こそ、手を抜くな。

Page 86: Word benchしずおか20130727

まとめ•小さい会社でもドキュメント化して共有することで、安易で必要のない仕様変更を防ぐ

•ドキュメントを残しておくことで作業の無駄を排除することが出来る。

• webのワークフローは基本ループです。

Page 87: Word benchしずおか20130727

ご清聴ありがとうございました。