SharePoint 2013 のデザインを変えたいなーと思い調べていると、Microsoft Download Center で非常に有益そうなツールが公開されていましたので試してみました。ツールのダウンロードは下記 URL から行えます。まだ英語版しかありませんが、簡単に利用できるツールになっています。

SharePoint Color Palette Tool
http://www.microsoft.com/en-us/download/details.aspx?id=38182

SharePoint Color Palette Tool

ツールのインストールが終わったら、さっそく起動してみましょう。起動すると、左側にカラー パレットが並んでおり、真ん中にはプレビューが表示されています。左側のカラー パレットは「Buckets」という括りでグループ化されていますが、「Group by:」の隣にある「Color Buckets」をクリックすることで、ドロップダウンメニューから「UI Groups」「UI Type」を選択でき、UI 要素毎等でグループ化し並び替えることができます。個人的には「UI Groups」が分かり易くお気に入りですかね。

また、プレビューの上の「Layout:」の隣にある「olso」をクリックすることで、ドロップダウンメニューからプレビュー表示方式も変更することができます。「Z – UI Preview」を選択すると、SharePoint で使われている UI 要素毎の見た目を一度に確認することができます。これは、配色の考慮漏れを防ぐにあたって非常に嬉しい機能だなと思いました。

20130426-1

テーマ ファイルの書き出し

プレビューを行いながら、画面配色が完成したら SharePoint で利用できるように「.spcolor」という拡張子のテーマ ファイルを書き出します。「File」メニューから「Save」を行うことで「.spcolor」ファイルの書き出しが行えます。

作成したテーマ ファイルを SharePoint へ登録

テーマ ファイルの登録は、サイト コレクションの設定にて行います。手順は、大きくは下記の2点です。

  1. 「Web デザイナー ギャラリー」セクションの「テーマ」ライブラリへ「.spcolor」ファイルをアップロード
  2. 同じく「Web デザイナー ギャラリー」セクションの「構成済みの外観」へテーマ情報の登録

登録が終わると、「外観」セクションの「外観の変更」から作成したテーマを選択できるようになります。詳細な登録手順は、また機会があればブログへ投稿したいと思います。

まとめ

テーマは SharePoint 2010 でも存在した仕組みですが、凝った配色となると PowerPoint 2010 を利用して作成する必要がありました。2013 からは無償のツールで提供され、しかも UI 要素単位まで詳細にプレビューできるとのことで、簡単・気軽に配色の変更が行えますね!

注意点として、こちらのツールは SharePoint 2013 を対象としたものであるため、SharePoint 2010 では利用できません。

あとは、やはり配色に関するセンスが必要となるようです…。今回ツールを試しながら作成したテーマをキャプチャとして公開しようと思ったのですが、恥ずかしいのでやめておきます!!