Edytor HTML Edzi za pośrednictwem impress.js

Question

Ostatnio wiedziałem, że impress.js został stworzony jako wersja Prezi w HTML5. Pomaga nam to odejść od zastrzeżonej technologii Flash i zamiast tego używać otwartego standardu internetowego, który stanie się uniwersalny dla wszystkich platform.

Jednak denerwujące jest wpisywanie kodu w edytorze tekstu HTML (np. Pisanie tłumaczenia, obrót i wartości skali slajdu). Trudno jest wizualizować prezentację, zwłaszcza gdy kod zostanie przedłużony do nieznośnej długości.

Oto przykład, który właśnie stworzyłem. Czytając poniższy kod HTML, trudno jest dokładnie określić, gdzie znajdują się slajdy i jak będą one wyświetlane.

<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> 

A JS Fiddle Example.

Czy jest tam edytor WYSIWYG HTML5 Prezi, którego mogę użyć? Chciałbym taki, ponieważ znacznie ułatwi tworzenie prezentacji opartych na HTML5, CSS3 i JavaScript.

Answer 1

Hej, ostatnio zrobiłem Strut. Jest to edytor prezentacji tylko dla ImpressJS i jest obecnie w alfa, ale jest na żywo demo tutaj: http://strut.io

Github repozytorium: https://github.com/tantaman/Strut

i tutaj jest youtube vid o tym: http://www.youtube.com/watch?v=zA5s8wwme44&feature=share

Możesz dodawać/usuwać slajdy, wstawiać obrazy i pola tekstowe, zmieniać czcionki, zapisywać prezentacje i modyfikować przejścia między slajdami, przesuwając slajdy w kierunkach x, y &.

Answer 2

do edycji slajdy treści inline jest pierwszy prototyp wykonany z Aloha Editor * dostępny w http://lab.evo42.net/editable-impress.js/ - dodawanie lub organizowanie slajdów nie jest jeszcze możliwe ...

*) http://aloha-editor.org

Answer 3

Alternatywnie, można użyj Presenteer.js (http://willemmulder.github.com/Presenteer.js/), który po prostu przesuwa się z jednego elementu HTML do drugiego i centruje/powiększa go w okienku ekranu. Nie będziesz potrzebował elementów danych, ale możesz po prostu pracować z CSS.

Answer 4

Niedawno opublikowałem działający prototyp impress.js editor, w którym skupiłem się na pozycjonowaniu slajdów w prezentacji na WYSIWYG.

Możesz śledzić postęp lub zgłaszać problemy na github: https://github.com/naugtur/builder4impress

Answer 5

Istnieje kilka edytorów WYSIWYG dla Impress.js, omówione on its GitHub emisyjnej trackera.

Strut i Impressionist wydają się być najbardziej chwalone. Strut jest bardzo aktywnie rozwijany (ostatnie zatwierdzenie: wczoraj)

Nieopublikowany tam jest http://www.impressi.me/, który wydaje się być porzucony od kwietnia 2012 roku. Jest również bardzo prosty: można dodawać tylko tekst i przejścia. Brak obrazów, nie można wprowadzić niestandardowego rozmiaru czcionki.

Answer 6

Istnieje inny sposób tworzenia prezentacji impress.js i jest całkowicie bezpłatny - dostępny na stronie www.jspres.com.Moduł do tworzenia prezentacji jest oparty na JavaScript, ale projekt zawiera stronę serwera, która przechowuje prezentacje użytkowników i ma do nich dostęp z każdego komputera.

Wykonano dwie prezentacje z JSpres dla przykładu. Pierwsza to tylko promocja projektu, a druga to prezentacja, która wyobraziła sobie projekt na temat narodowych olimpiad IT w moim kraju (to jest powód, że nie jest po angielsku, ale musisz zobaczyć przejścia: P)

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

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

Więc jeśli ktoś chce zobaczyć i spróbować, ale mają pewne problemy napisałem prosty przewodnik, który pomoże Ci zrozumieć podstawy i można je znaleźć tutaj: http://blog.jspres.com/2013/03/getting-started/

Więc pokażę trochę ekranów, żeby trochę sprowokować ciekawość w tobie, aby zobaczyć projekt. Chciałbym, żeby ci się to spodobało.