---
title: "WordPressテーマ開発の手順 – Olein Design編"
canonical_url: "https://olein-design.com/blog/wordpress-developing-flow"
language: "ja"
date_published: "2016-05-12T14:46:39+09:00"
date_modified: "2016-05-12T14:46:39+09:00"
content_type: "post"
author: "久野晃司"
taxonomies:
  category:
    - "WordPress"
    - "備忘録"
    - "思考"
  post_tag:
    - "日報"
---

# WordPressテーマ開発の手順 – Olein Design編

フリーランスとして独立した当初は、Web案件と印刷案件が五分五分というような比率でしたが、最近では９割以上がWeb案件となってきておりまして、その中でもWordPressなどのCMSを用いた開発が大半を占めています。 おかげさまでWordPress開発の数をこなすことによって、自分なりのベターな方法というか手順がある程度固まってきました。今回は簡単にそれらの流れを紹介しようと思います。 ## ヒアリングとワイヤーフレーム

 まずは、当然ではありますが最初はヒアリングをクライアントさんに行います。ホームページを作る目的や実現したいことなどをクライアントさんのビジネス内容把握とあわせて行います。ここはとても肝心な箇所でもあり、この時点で意思の疎通が難しくできるだけ全ての要望をお聞きしておかないと、（僕の場合）大概プロジェクトはうまくいきません。 間にディレクターなどが入っている場合には、極力クライアントさんと直接お話させていただく席に同席させていただいたりします。それが難しい場合は、やむを得ませんがクライアントさんをディレクターさんに置き換えてヒアリングするような形になります。 以来の内容によっては、この部分の要望が通らない場合もあります。その場合には、しっかりと内容を把握させていただくために時間を設けていただくか、または残念ではありますがお断りさせていただくこともあります。変な話に聞こえるかもしれませんが、プロジェクトに絶対に欠かせないのはこの段階だと断言できます。それくらいクライアントさんの要望などの把握はとても大切にしています。 お話を伺いながら簡単なワイヤーフレームをその場で描いて意見を聞くこともあります。プロトタイピングツールなどを用いても良いのですが、円滑に進めるためにはやはり手書きのワイヤーフレームが一番便利だったりします。（しかし、プロトタイピングツールを使うとクライアントさんは喜んでくれます。視覚的にモニターで見れるのでイメージしやすく楽しいのかもしれませんね） ## デザイン制作

 ツールを用いてデザイン案を作成します。 ツールに関しては色々と彷徨っていたりしますが、最近では基本Photoshopでベクターデータなど（ロゴやアイコンなど）は、クライアントさんごとに１つのAiファイルを作成して、アートボードを使い分けて制作します。それらをPhotoshopに持ってきてデザイン制作を進める形です。 Photoshopを利用する大きなメリットとして考えているのは「アセット生成」機能です。ほとんどこのために利用しているようなものです。レイヤー名などしっかりとつけておけば、ファイルを保存するたびに最新の画像データをかき出してくれるのでとても便利です。 WordPressテーマ制作に関しては、デザイン制作するページ数は案件によって異なってきます。ほとんどが予算に応じてデザインページ数が変わってくるような流れになっています。しかし、最低限トップページ、記事ページ、デザインが異なる固定ページは作ることが多いです。ここは案件によってまちまちです。 デザイン案を制作しない場合は、ある程度お任せにしていただく部分も多くあります。この点は本当に予算によります。 PDFデータなどでクライアントさんに確認していただき、デザインが全て校了しないと次の工程には絶対に進みません。ここで適当に済ませておくと、次工程でのデザイン変更などが発生し、場合によっては出戻りしなくてはならなくなるため、結果的にクライアントさんに迷惑がかかることになります。（時間の面でも費用の面でも） ## コーディング

 基本的に静的なページを制作するためにコーディングします。しかし、ここも予算の都合上カットされる場合があります。 その場合には、ローカル開発環境のWordPressに実際にテーマを設置して、コーディングしていきます。個人的にはしっかりとHTML/CSS/JavaScriptのコーディングを行い、チェックが完了してから組み込みを行いたいのですが、この点に関しては相談しながら進めていくことが多いです。 ## WordPressテーマ化

 コーディングが終了したらWordPress内で動作するように組み込み作業を行います。 一般的なホームページやブログとして利用する場合には、ある程度コードや知識の蓄積もあるので、最近では大分早く作業することができるようになりました。 しかし、カスタム投稿やタクソノミーをプラグインを使わずに実装したり、カスタマイザーでデザイン変更などを行えるようにする場合には、ちょっとお時間と工数をいただきます。 ## 実際に動作を確認

 WordPressテーマ化の部分でも随時確認用サーバーにアップロードし、クライアントさんにも実際にWordPressを触っていただくようにしています。 こうすることによって、捜査に不慣れなクライアントさんに少しでもわからないことを確認していただくことができます。操作などで不明な点があった場合には、その時点で質問していただき問題を解消していきます。こうすることによって、運用が始まったあとに気づくかもしれない問題点をあらかじめ確認しておくことが可能となります。 実際のページを確認しながら、最終的に変更したい部分やどうしても必要な細かいデザイン的な部分を修正・変更します。この時点で大きな変更が発生しないように、ヒアリングからデザイン制作・確認の工程がとても大切になります。 ## まとめ

 数年前までは、ある程度制作工程に予算を割いてくれるクライアントさんも多くみえたのですが、最近では僕の方から制作費はなるべく抑えるよう勧めることが多くあります。 それは「作って終わり」にならないためです。ホームページは作ってからがスタートです。作って完成ではありませんし、そもそも最終的な完成なんてないと思っています。 運用を進めていく上で問題はどんどん出てきます。それらをちょっとずる修正・改良していくための予算を残しておいていただくためにも、制作費は必要最小限にするべきだと提案させていただいています。 また、そのような方法でホームページ運用を進めていただけるクライアントさんとは、その後も良好なパートナー関係を築いていき、いろいろなお手伝いをさせていただけることも多くなっています。 今後も、クライアントさんのビジネスのお手伝いがますますできるように精進していこうと思います。