いわゆるフラッシュプレゼン（*）のスライドの作成においては「文字を抜いていく」という意識が不可欠。サンプルで解説してみます。 セリフ（口頭で話す内容）をそのまま記入した例スライド内のテキストボックス内に自動折り返しで文字を入力しただけの状態。 これを、グラフィックデザインでは「ナリユキ」といいます。この場合だと「好きなのは」というカタマリが分断されてしまうので、読むスピード（＝理解のスピード）が落ちてしまいます。 プレゼンのスライドは、ある意味、すべてがキャッチコピー。 「読んでから理解する」のではなく、ポスターのように一瞬で「すっと入ってくる」ようにするためには、改行のケアが不可欠です。 なお、行間も調整されていないため、上下の行が、つながっているのか、別のアイテムなのか、「パッと見」で判断できません。 ナリユキをやめて文節で改行ナリユキをやめて、文節で改行した例です。行間も調整していま
【勉強法】の本を30冊読むマラソン、４冊目はいります。 ４冊目はこの本↓です。 <わかりやすさ>の勉強法 (講談社現代新書) 「わかりやすい説明」で有名な池上彰さんの本。 "勉強法"というキーワードで選んだのですが、 中身は「わかりやすい説明ができる人になるには、どうすればよいのか」というものでした。 池上さんの解説って本当にわかりやすいですよね。 どうして池上さんの解説がわかりやすいのか。 その秘訣が、この本で解明されていました。 この秘訣を実践すれば、私たちも池上彰さんのように、 「わかりやすい説明をする人」と評価されるようになるはずです！ 今回の記事では、この本の情報を整理して、 "プレゼンテーションの準備段階3ステップ ＆ 本番3ステップ"としてまとめました。 今日からすぐできること "プレゼンテーション準備と本番"は以下の手順で。 【プレゼンテーション準備・資料の作り方】 キモ（
書籍化し、12万部突破しました。 【SlideShare広告回避用】 https://www.docswell.com/s/morishige/K3MXPZ-howtodesignslides ・PDFは無料でダウンロードできます ・自己学習や勉強会などの目的でしたらご自由にお使いいただけます ・授業・研修への利用はフォーム( https://forms.gle/WwgXTT974xFW78mFA )にご報告ください ・記事への参考資料にする際は適切な出典明記をお願いいたします 【使っているフォントについて】 M+フォント「MigMix1P」です。こちらもメイリオ同様おすすめです。 フリーで使えます。 【個人HP】 > https://mocks.jp > 仕事のご依頼はこちらから 【書籍情報】 デザイン入門：https://amzn.asia/d/4WDsTI6 デザイン図鑑：https
新しいプレゼンテーションツールを提供しているPowtoon*2がまとめてくれた「Why your PowerPoint Presentations Suck and What To Do About it.」を基に、日本人が大好きな「箇条書き」を使わない方がいい科学的な理由を4つご紹介しよう。日本の法人が作るプレゼンがやたらとレベルが低いことは至る所で言及されている。1つのスライドにアホみたいに文字をぶっ込み、専門用語を羅列するのがかっこいいと思っているのかわからないが、とにかく何を伝えたいのかわからない。 それに比べて米財務省が作ったパワポスライドは素晴らしく見やすい*1。でも、これは単にデザインセンスの問題なのか、人前で話すのが苦手だからなのかと疑問に思っている方も多いだろう。 そこで、新しいプレゼンテーションツールを提供しているPowtoon*2がまとめてくれた「Why your P
デモ：slide 3 [スペース]キーでスライドのオーバービューを表示。 [ad#ad-2] reveal.jsの主な特徴 reveal.jsは複数のパネルをダイナミックなスライドのアニメーションで表示することができます。 新しく改善されたスタイル。 下部にコントロールが可能なナビゲーション。 「highlight.js」を内包、コードのシンタックスハイライトに対応。 トランジションのテーマはdefault/concave/linearの3つ。 他のスライドをネストすることも可能。 各パネルごとに直接アクセスが可能。
Gistぺたり 短いながら、phantomjsの便利なAPIが詰まってたので貼ってみた。 % phantomjs shot.js Reveal.jsって？ reveal.js - The HTML Presentation Framework いわゆるHTMLスライドのフレームワークです。最初からある程度かっこよく作られていて、そのままでも十分使えると思います。APIもちゃんと整備されているので、コントロールを追加することもできます。 複数のテーマが用意されている 複数のトランジションが用意されている Markdownで書ける（data-markdownを付与したsectionのみ） nodeでKeynoteみたいなスライドウインドウ＋スピーカーノートウインドウの連携ができる などなど。今用意している最中のスライドでは、これを使ってみています。 なんでスクリーンショット？ 普通にPDFで出
昨日, コリスさんの記事で紹介されていた reveal.js に一目惚れしてしまったので使い方をまとめてみました. reveal.js の使い方を reveal.js を使って解説しています. 簡単にオシャレでシンプルなプレゼンを作れるのでぜひ遊んでみてください. 追記: 『reveal.jsベースのプレゼンをWeb上で作れちゃうオンラインエディタ『rvl.io』の使い方をrvl.ioを使って解説してみた』というエントリーを公開しました. とても便利なので, よかったらこちらも参考にしてくださいな♪ Sample reveal.js を解説しているサンプルはこちらです. また, 最小サンプルも作ってみました.(こちら) Download 今回制作したサンプルはこちらでダウンロードできます. index.html が 解説しているサンプル, sample.html が最小サンプルになります.
コワーキングスペースでのプレゼンをするにあたって、格好良いのが無いかなと探していたら、reveal.jsというのがあったので、今回はこれを使ってプレゼンを作ってみました。 お題は「HTML5再入門」。 まぁありきたりと言えばありきたりですし、プレゼンはあまりやった事がないので、エフェクトが格好良いのでないと、目を引かないっしょ、という理由もありますw このreveal.jsのHTMLもHTML5になっています。 <body> <div class="reveal"> <!-- Any section element inside of this container is displayed as a slide --> <div class="slides"> <section> <h1>HTML5再入門</h1> <h3>HTML5をおさらいしましょう</h3> <img src="im
reveal.jsはCSS3/JavaScriptで作られたプレゼンテーションソフトウェアです。 reveal.jsはHTML5/CSS3を使ったプレゼンテーションソフトウェアです。まずは言うに及ばず、そのクールな画面を見てもらいましょう。 トップです。この雰囲気からして格好いいです。 スライドを切り替える時に3Dイフェクトがかかります。これまた格好いいです。 水平に動くのが基本ですが、垂直にスライドさせる指定もできます。 デモ動画です。スペースキーでスライド一覧が出せます。 reveal.jsはスライドの切り替えがとにかく格好いいので、これでプレゼンテーションを行えば観衆の注目を引くこと間違いないでしょう（もちろん内容が大事ですが）。 reveal.jsはCSS3/JavaScript製、MIT Licenseのオープンソース・ソフトウェアです。 MOONGIFTはこう見る プレゼンテー
Hello Therereveal.js enables you to create beautiful interactive slide decks using HTML. This presentation will show you examples of what it can do. Vertical SlidesSlides can be nested inside of each other. Use the Space key to navigate through all slides. Basement Level 1Nested slides are useful for adding additional detail underneath a high level horizontal slide. Basement Level 2That's it, time
最近、keynoteでプレゼン資料を作ることが増えてきました。 PowerPointで作成するよりも、keynoteで作る方が、フォントが綺麗だし ガイドのラインも出て、配置も綺麗にそろえられるため keynoteを多く使うことが増えてきました。 プレゼンの資料は、中身が勝負でテクニックじゃないのですが あまりにも、見た目の悪いプレゼン資料だと、見てもらえないと せっかく作った良い内容も、台無しになるので、 いままで本などで読んだ、テクニックをまとめておこうと思います。 ポイントについて、個別に説明していきます。 １．見やすいフォント フォントを見やすくするために、「ヒラギノ角ゴStdN 」を指定します。 このフォントにすると、太文字ではっきり見えるので、 プロジェクターに表示しても見やすくなります。 また、フォントの大きさも、72pt、64pt、48ptを使います。 バラバラの大きさを使
HTML Slide PresenterはHTMLスライドをApple Remoteでの操作可能にする等、より良いプレゼンテーションを実現するソフトウェア。 HTML Slide PresenterはMac OSX用のオープンソース・ソフトウェア。プレゼンテーションというのはアピールが重要だ。パソコンのスライドを見ながら黙々と読み進めているようでは何のアピールにもならない。せっかくスライドに凝ったならば、その発表方法にも気を配ろう。 表示例 HTMLでプレゼンテーションを作成した場合、操作する際にはコンピュータの前にいなければならない。そんな束縛からあなたを解放してダイナミックなプレゼンテーションを実現してくれるのがHTML Slide Presenterだ。 HTML Slide PresenterはHTMLで書かれたプレゼンテーションをより使いやすくするソフトウェアだ。まず最大の機能が
CSSSはHTML5/JavaScript/CSS3で作られたWebベースのプレゼンテーションテンプレート。 CSSSはHTML5/JavaScript/CSS3によるオープンソース・ソフトウェア。最近はHTMLやJavaScriptを使って作られたプレゼンテーションが増えている。JavaScriptでキーの動きに合わせてスライドを動かす類のものだ。 奇麗なHTMLプレゼン コンテンツがHTMLベース、つまりテキストで作れるのが大きな魅力だろう。そして最新のWeb技術を盛り込んで作られたのがCSSSだ。 CSSSは矢印キーによるスライドと切り替えと、Ctrlキーと組み合わせたキーボードショートカットをサポートしている。Ctrl+Hでスライドのサムネイル一覧を作ることもできる。矢印を押すたびに文字が追加表示されていくと言ったアクションも実装できる。 スライド一覧 良いと思ったのは、スライドの
LandslideはテキストファイルをHTMLベースのプレゼンテーションに変換するソフトウェア。 LandslideはPython/HTML5製のオープンソース・ソフトウェア。最近はHTMLによるプレゼンテーション作成も見られるようになってきた。HTMLの方が表現力が高く、デザインの自由度もあるために格好いいものが多い。画一的なプレゼンテーションは飽きてしまう。 スライド だが皆が使い始めると、より人と違ったものを使いたくなるのが常だろう。そこで新しいHTMLプレゼンテーションであるLandslideを紹介しよう。HTML5を使ったクールなプレゼンテーションが実現する。 Landslideは前後のスライドが左右に表示されるタイプのプレゼンテーションだ。ドキュメントはMarkdownまたはReStructuredTextで記述して、それをLandslideコマンドで変換する。さらにPDFへの
QueryNote - jQuery based presentation tool jQueryベースのプレゼンツール、QueryNoteの紹介 Author 37to Enter:進む Shift+Enter:戻る Agenda HTMLベースで作成されたプレゼンツール QueryNoteについて 特徴 まとめ 1.HTMLベースで作成されたプレゼンツール Slidy http://hyper-text.org/archives/2007/02/slidy.shtml W3C謹製のプレゼンツール S5 http://meyerweb.com/eric/tools/s5/ Slidyと同様に有名なツール S6 http://d.hatena.ne.jp/amachang/20071121/1195627344 id:amachang作成のプレゼンツール Slidy 綺麗なHTMLで掛ける
ドットインストール代表のライフハックブログ
ちょっと変わったプレゼンツール「prezi」の使い方に関するライフレシピをご紹介します。nanapi [ナナピ]は、みんなで作る暮らしのレシピサイトです。はじめに プレゼンテーションをするとき、面白い資料を作りたいと思っても自分はセンスがないからなんて思うこと、ありませんか？ そんな人にお勧めなのがプレゼンテーションツール「Prezi」です。 サンプル まずは実際にサンプルを見てみてください。 http://prezi.com/q7llguh7c-zt/presentation/ (リンク先中央、右向き三角形をクリック) 特徴 拡大縮小・回転・スライド等の動きのあるプレゼンテーションが可能になります。拡大縮小を使うことで一つのテーマを視覚的に分かりやすくまとめることができますし、プレゼン自体の全体像も分かりやすくなります。 さらに拡大縮小をうまく使えば一画面に文字を詰め込みすぎてた見
jQuery-PresentationはjQuery/JavaScript製のオープンソース・ソフトウェア。プレゼンテーションを作成するソフトウェアと言えばPowerPointやKeynote、WebアプリケーションであればGoogleドキュメントを利用する方法がある。 HTMLでプレゼンを だが画一的な表示のプレゼンテーションは聴衆をすぐに飽きさせてしまう。もっと柔軟性に富んだプレゼンテーションを行いたいならばHTMLを使ってみると良いだろう。jQuery Presentationを使えばさらに拡張性も期待できそうだ。 jQuery Presentationは名前の通りjQueryを使って作られているプレゼンテーションソフトウェアだ。矢印キーの左右やリンクをクリックしてスライドを切り替えることが出来る。現状ではそれだけに限定されるようだ。ページ一覧や検索機能などがあるとさらに便利そうだ。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
