ニフクラ mobile backend(mBaaS)お役立ちブログ

スマホアプリ開発にニフクラ mobile backend(mBaaS)。アプリ開発に役立つ情報をおとどけ!

パワポやKeynoteでモックが作れるテンプレートやプラグインご紹介!

https://cdn-ak.f.st-hatena.com/images/fotolife/f/fjct/20171017/20171017135030.png

スマホアプリは画面が小さいこともあってデザインをいろいろ試して確認していかなければなりません。そこで使えるのがモックアップ作成ツールなのですが、そのために専用ソフトウェアを購入するのは躊躇してしまう人も多いはずです。

そこで今回は使い慣れたPowerPointやKeynoteといったプレゼン作成ソフトウェアを使ってスマホアプリデザインのモックアップが作れるテンプレートやプラグインを提供しているサイトを紹介します。Webサービスとは違って、ダウンロードしてしまえばオフラインでも作成できるのが魅力です。

Keynotopia

Keynotopia
Keynote/PowerPoint/OpenOffice.orgなどのスライド作成ソフトウェアで使えるテンプレートを販売しています。iPhone/iPad/Android/Web/Blackberry/Windows Phone/Facebook/Mac OSX/Windows 8など様々なソフトウェア向けのプロトタイプがテンプレートになっています。

Keynotopia: User Interface Design Libraries for Keynote, PowerPoint and OpenOffice

Wireframe toolkit for Keynote and Powerpoint

Wireframe toolkit for Keynote and Powerpoint
iPhoneアプリに特化しています。2色になっていて、シックなデザインに仕上がります。

Wireframe toolkit for Keynote and Powerpoint - Raizlabs

PowerMockup

PowerMockup
PowerPoint用のプラグインを提供しています。2007/2013に対応しています。

Wireframing and Storyboarding Tool for PowerPoint | PowerMockup

powerWIREFRAME

powerWIREFRAME
こちらもPowerPoint用のプラグインです。800をこえるUIコントロールが提供されています。

Create Wireframes in PowerPoint with powerWIREFRAME

GUIToolkits

GUIToolkits
iOS/Android/Blackberry/Windows Mobileなど多様なプラットフォームのアプリのプロトタイピングができます。テンプレートはKeynote/PowerPointの他、Visio、Illustrator、Fireworks、OmniGraffleなどに対応しています。

User Interface Design Toolkits for Mobile and Web Apps

Free Windows 8 Wireframe Templates for PowerPoint

Free Windows 8 Wireframe Templates for PowerPoint
Windows 8向けのワイヤーフレームテンプレート(PowerPoint)が無料配布されています。

Free Windows 8 Wireframe Templates for PowerPoint - Designmodo

Keynote Kung-Fu

Keynote Kung-Fu
Keynote/PowerPoint向けにWeb/モバイルデバイスのテンプレートを販売(12ドル)しています。

Keynote Kung-Fu: Wireframe Toolkit for Keynote

PowerPoint Storyboard

PowerPoint Storyboard
ツイートするとAndroid/Blackberry/Facebook/iPad/iPhone/Web/Windows 7といった多様なテンプレート(PowerPoint)が無料でダウンロードできます。Visual Studio向けのファイルもあります。

Free PowerPoint Storyboard Templates | PowerPoint Storyboard

さいごに

プラグインの場合はステンシル含めて提供されていて、テンプレートの場合はコントロールをコピー&ペーストして作成していくイメージになるようです。PowerPoint/Keynoteであれば、作ったモックアップに引き出し線をつけて説明したり、コントロールのグループ化や拡大/縮小など普段使い慣れた操作ができるのでさくさく作れそうです。

PowerPoint/Keynoteを使ったモックアップ作りであればアプリ初心者でも簡単にできるでしょう。モックアップをたくさん作って、いろいろな角度から検討してください。

f:id:mbaasblog:20180927104348p:plain