16

私は最近、impress.jsがPreziのHTML5バージョンとして作成されていることを知りました。これにより、独自のFlashテクノロジーから脱却し、代わりに、すべてのプラットフォームでユニバーサルになるオープンWeb標準を使用できます。

ただし、HTMLテキストエディタでコードを入力するのは面倒です（スライドの平行移動、回転、スケール値の記述など）。特にコードが耐えられない長さに拡張されると、プレゼンテーションを視覚化することが難しくなります。

これが私が作成した例です。以下のHTMLコードを読むとき、スライドがどこにあり、どのように表示されるかを正確に知ることは困難です。

<div id="impress">
    <div class="step" data-x="0" data-y="0">
        Slide 1 at origin.
    </div>

    <div class="step" data-x="100" data-y="100" data-scale="0.5">
        Slide 2 has been moved south-eastern side and shrunk by half compared to slide 1.
    </div>

    <div class="step" data-x="-500" data-y="-405" data-rotate-x="50" data-rotate-y="-34" data-rotate-z="50" data-scale="2.5">
        Slide 3 has been rotated in 3D and is 2.5x larger than slide 1.
    </div>
</div>

<script type="text/javascript" src="impress.js"></script>

JSフィドルの例。

では、使用できるWYSIWYG HTML5 Preziエディターはありますか？HTML5、CSS3、JavaScriptに基づいたプレゼンテーションを作成するのがはるかに簡単になるので、1つ欲しいと思います。

4

6 に答える 6

34

ねえ、私は最近ストラットを作りました。ImpressJS専用のプレゼンテーションエディタであり、現在アルファ版ですが、ここにライブデモがあります： http ：//strut.io

Githubリポジトリ：https ：//github.com/tantaman/Strut

そしてここにそれについてのユーチューブビデオがあります： http ：//www.youtube.com/watch？v = zA5s8wwme44＆feature = share

スライドをx、y、z方向に移動することで、スライドの追加/削除、画像やテキストボックスの挿入、フォントの変更、プレゼンテーションの保存、スライド間の遷移の変更を行うことができます。

于 2012-05-08T01:30:34.597 に答える
5

Impress.js にはいくつかの WYSIWYG エディターがあり、GitHub の問題トラッカーで説明されています。

StrutとImpressionistが最も高く評価されているようです。Strut は非常に活発に開発されています (最後のコミット: 昨日)

http://www.impressi.me/は議論されていませんが、これは 2012 年 4 月から放棄されているようです。これも非常に基本的なもので、テキストとトランジションしか追加できません。画像がありません。カスタム フォント サイズを入力できません。

于 2012-08-08T10:41:55.680 に答える
3

impress.js プレゼンテーションを作成する別の方法があり、それは完全に無料です - www.jspres.com で入手できます。プレゼンテーションを作成するためのモジュールは JavaScript ベースですが、プロジェクトにはユーザーのプレゼンテーションを保存するサーバー側が含まれており、ユーザーはすべてのコンピューターからアクセスできます。

例として、JSpres で作成された 2 つのプレゼンテーションがあります。1枚目は単なるプロジェクトの宣伝で、2枚目は私の国の全国ITオリンピックでのプロジェクトをイメージしたプレゼンテーションです（これが英語ではない理由ですが、トランジションを確認する必要があります:P)

http://jspres.com/presentation/present/p:3

http://jspres.com/presentation/present/p:31

したがって、誰かがそれを見て試してみたいが、いくつか問題がある場合は、基本を理解するのに役立つ簡単なガイドを書きました。

ですから、プロジェクトを見て少し好奇心をそそられるように、いくつかの画面を表示します。気に入っていただければ幸いです。

ここに画像の説明を入力 ここに画像の説明を入力ここに画像の説明を入力ここに画像の説明を入力ここに画像の説明を入力

于 2013-06-13T14:02:57.227 に答える
2

私は最近、プレゼンテーションでのスライドの WYSIWYG 配置に焦点を当てた、機能するimpress.js エディターのプロトタイプを公開しました。

進行状況を追跡したり、github で問題を報告したりできます: https://github.com/naugtur/builder4impress

于 2012-07-02T15:55:00.697 に答える
2

スライドのコンテンツをインラインで編集するために、Aloha Editor* で作成された最初のプロトタイプがhttp://lab.evo42.net/editable-impress.js/で入手できます。スライドの追加や配置はまだできません...

*) http://aloha-editor.org

于 2012-03-07T00:57:39.620 に答える
2

または、Presenteer.js ( http://willemmulder.github.com/Presenteer.js/ ) を使用することもできます。これは、ある HTML 要素から次の要素に単純に移動し、ビューポートで中央揃え/ズームします。データ要素は必要ありませんが、CSS で簡単に作業できます。

于 2012-04-02T10:50:30.743 に答える