Изменения

Презентация-трансформер: S5 на MediaWiki

13 035 байтов добавлено, 10:25, 14 апреля 2010
м
6 версий
http://events.kapranoff.ru/proposals/23 <slide style="custis" scaled="true" headingmark="Слайд">
;author: Виталий Филиппов
;addcss: * { font-family: "Segoe Print" !important; } .full resc img { positionwidth: absolute500px; topheight: 0auto !important; left} pre { font-family: 0; right: 0; margin: 0 autoConsolas !important; }
</slide>
== Слайд ==
<span style="color:#aaa">Все знают о</span> "Смерти через PowerPoint" == Слайд == <br />[[Файл:DeathByPowerPoint.png|400px]][[Файл:DeathByPowerPoint1.png|400px]] [[Файл:DeathByPowerPoint2.png|400px]] == Слайд == Почему так происходит? == Слайд == Люди гонятся за 2 зайцами! [[Файл:Playboys.gif|800px]] == Слайд == Презентация  <tab sep="bar"><span style="color:#a00">Демонстрация</span><br />Продажа | | &nbsp; | <span style="color:#00a">Самостоятельное&nbsp;чтение</span><br />Обучение</tab> == Слайд == <span style="font-size: 200%">ГУРУ</span> [[Файл:BlueOwl.jpg|650px]] говорят нам: == Слайд ГУРУ == * 1 мысль <span style="color: #aaa">(умная)</span>* 1 картинка <span style="color: #aaa">(красивая)</span>* 1 график <span style="color: #aaa">(простой)</span> <span style="font-size: 200%">...</span> == Слайд == <p style="text-align: right">"Больше всё равно <br /> <span style="color:#a00">не поймут</span>"</p> == Слайд == <span style="font-size:200%">&rarr;</span> == Слайд == [[Файл:Hypnotoad.jpg]] (гипножаба) == Слайд Гипножаба == <center><span style="color: #aaa">Отличные</span> "продажные" <span style="color: #aaa">презентации</span></center> <center>НО</center> <center><span style="font-size: 200%">Нечитаемые</span></center> <p style="text-align: right; color: #aaa">Даже тему уловить бывает сложно.</p> == Слайд == После показа - умирают! <p style="text-align: right; color: #aaa">Отняв время на создание.</p> == Слайд == Мы - разработчики. == Слайд Презентации == Нам они нужны для:* Учебных курсов* Демонстраций* Обсуждений == Слайд == И нужны ЧАСТО. <p style="text-align: right; color: #aaa">&rarr; в базу знаний.</p> == Слайд == Мы - <span style="color: #07e">CustIS</span> У нас база знаний - MediaWiki [[Файл:MediaWiki-notext.svg|link=|400px]] == Слайд == <span style="font-size: 200%">S<sup>5</sup></span> == Слайд == <br /> A Simple Standards-Based Slide Show System <span style="font-size: 75%">http://meyerweb.com/eric/tools/s5/</span> == Слайд == Чистый HTML+JS. Кроссбраузерный. [[Файл:OperaLogo.png|link=]] [[Файл:FurryFirefox.jpg|link=]] [[Файл:ChromeLogo.jpg|link=]] == Слайд == <br /><br /><span style="font-size: 150%">{{Forall}} статья &rarr; презентация.</span> <pre style="font-family: Consolas !important; text-align: left;"><slide style="custis" scaled="true" headingmark="Слайд">;author: Виталий Филиппов;subfooter: Привет всем!</slide></pre> == Слайд 6 стилей == <tab sep="bar" head="top">custis|default|blue{{SERVER}}{{SCRIPTPATH}}/extensions/S5SlideShow/custis/preview.png|{{SERVER}}{{SCRIPTPATH}}/extensions/S5SlideShow/default/preview.png|{{SERVER}}{{SCRIPTPATH}}/extensions/S5SlideShow/blue/preview.png</tab><tab sep="bar" head="top">flower|yatil|pixel{{SERVER}}{{SCRIPTPATH}}/extensions/S5SlideShow/flower/preview.png|{{SERVER}}{{SCRIPTPATH}}/extensions/S5SlideShow/yatil/preview.png|{{SERVER}}{{SCRIPTPATH}}/extensions/S5SlideShow/pixel/preview.png</tab> == Слайд Вставка кода == <pre><code-java>...</code-java></pre> Обход коллекции<code-java>Collection<String> strings = new ArrayList<String>();for (String item : strings) { System.out.println(item);}Iterator<String> it = strings.iterator();while (it.hasNext()) { String string = it.next();}</code-java>порядок, в котором будут возвращаться элементы определяется реализацией(LinkedList, HashSet, …) == Слайд Mindmaps == [[Файл:СмежнаяСпециальность.mm]] == Слайд TeX == <pre><m>\hat{f}(\omega)=\frac{1}{\sqrt{2\pi}}\int\limits_{-\infty}^{\infty}f(x)e^{-ix\omega}\,dx</m></pre> <div class="resc"><m>\hat{f}(\omega)=\frac{1}{\sqrt{2\pi}}\int\limits_{-\infty}^{\infty}f(x)e^{-ix\omega}\,dx</m></div> == Слайд GnuPlot =={| class="wikitable"|-| <plot>set xrange [16:34]set grid yticsset style fill solid 1.0 noborderset boxwidth 0.7 relativeset title 'Топ Бездны'plot 'Хорошие.dat' with boxes lw 2, 'Отличные.dat' with boxes lw 2DATASET Отличные24 126 227 1728 1729 2130 1531 1032 933 234 2ENDDATASETDATASET Хорошие16 217 518 819 420 621 822 1223 3524 6625 16726 28527 49028 68329 78730 85731 65632 37433 14034 67ENDDATASET</plot>|<pre style="font-family: Consolas !important"><plot>set xrange [16:34]set grid yticsset style fill solid 1.0 noborderset boxwidth 0.7 relativeset title 'Топ Бездны'plot 'Хорошие.dat' with boxes lw 2, 'Отличные.dat' with boxes lw 2DATASET Отличные... </plot></pre>|} == Слайд Flash-видео == <pre>[[Файл:WikiBookmarksDemo.flv|500px]]</pre> <center>[[Файл:WikiBookmarksDemo.flv|500px]]</center> == Слайд Более простые == Картинки, <br />&nbsp; &nbsp; &nbsp; Таблицы, <br />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Стили текста... Всё есть. <span style="color:#aaa">Ведь это всё ещё </span><span style="color: #a80">MediaWiki</span> == Слайд Live Preview == [[Файл:LivePreview.png|800px]] == Слайд == Похоже на [http://takahashi.su/ Такахаши]. <p style="text-align: right; color: #aaa"><s>(в FF 3.6 не работает)</s></p> <p style="text-align: right; color: #aaa">О, уже починили.</p> == Слайд == НО <span style="color: #06d">Кроссбраузерно</span> <span style="color: #dd0">Богато '''фичами'''</span> <span style="color: #d00">Часть Базы Знаний</span> == Слайд == <span style="color: #aaa">У нас стало</span> популярно быстрее<span style="color: #aaa">, чем мы распиарили :)</span> == Слайд == </ВСЁ> <center><small>Виталий Филиппов</small></center> <center><small style="color:#aaa">vitalif *трям-трям* mail.ru</small></center>  == Аннотация == Классические презентации — «устное выступление перед аудиторией, дополняющее аудиоканал визуальным каналом со слайдами», известны всем. Какие у них самые известные проблемы? Все, наверное, знакомы с «[http://www.slideshare.net/thecroaker/death-by-powerpoint-rus Смертью от Powerpoint]», гласящей, что основная проблема — перегруженность слайдов информацией. Дело в том, что выступающий пытается угнаться за двумя зайцами и делает слайды двойного назначения — такие, под которые можно и «выступить», и такие, чтобы их могли прочитать отсутствующие на выступлении. Хочется, как лучше, а получается, как всегда — страшные «слайдоменты» (гибриды документа и слайда) вырубают аудиторию, заставляя её читать мелкий текст под монотонный бубнёж диктора. Но и самостоятельно читать «слайдоменты» сложнее, чем обычную статье. Кроме того, слайды обычно являются бинарными документами (Open Office, Keynote, PowerPoint), что убивает конкурентную работу и контроль версий. Итог — слайды, если это не какое-нибудь [http://takahashi.su/ Такахаши] (которое в FF 3.6, кстати, не работает) — исключительно ''write-only'' продукт, который создаётся единожды, более не развивается и пылится в дальних углах файлохранилища. Гуру «слайдологии» говорят — оставьте на слайде 1 мысль, 1 строку текста, 1 иллюстрацию, 1 график и так далее, потому что большее никто всё равно не осилит. И говорят, что на выходе будет «идеальная» презентация. На самом деле на выходе будет красочная WOW-презентация в стиле «гипножаба», идеальная для менеджера по продажам и абсолютно невозможная к самостоятельному изучению. У нас, разработчиков, цели другие — презентациями нам надо не продавать, а рассказывать и обучать (в том числе, чтобы обучала сама презентация, без нас). Делать презентации нам надо быстро и часто — к каждой демонстрации, совещанию, учебному курсу. Их необходимо целостно развивать, вносить изменения. Нужна возможность параллельной коллективной работы. Ну и хотелось бы, чтобы все было максимально быстро — минимум затрат, максимальный эффект — и чтобы можно было использовать все — текст, анимацию, видео, майндмапы, ибо время тупых статичных слайдов давно умерло вместе с диапроекторами. Встречайте! Решение — прикрученная к MediaWiki система презентаций S5 (чистый html+javascript). Любая статья MediaWiki теперь может быть не только прочитана, но и показана как презентация! Разумеется, в слайд-части разрешаются иллюстрации, тезисы, а поясняющая текстовая часть статьи (если таковая есть), в режиме презентации скрывается. Сохраняются все возможности MediaWiki: * Быстрое совместное редактирование, с контролем версий и историей изменений.* Поддержка сотен расширений эффективной публикации (раскраска кода, автоматические диаграммы, майндмапы и т. п.).* Презентация-статья — стандартный и целостный элемент общей базы знаний (ссылки, включения, шаблоны и т. п.). И при этом используются все возможности веб-публикации: * встраивание видео, флеш-объектов и т. п., они гораздо богаче возможностей PowerPoint или PDF-слайдов.* можно мгновенно перейти от просмотра статьи к показу слайдов используя только броузер.* есть навигация по слайдам, функциональность таймера. Чем-то это похоже на «[http://takahashi.su/ Такахаши]» — метод экстремально быстрого создания презентаций, порождаемых из плоского текста. Только S5 — это не XUL, а чистый кроссбраузерный HTML и JavaScript, помноженные на удобства централизованной базы знаний на движке MediaWiki, и в нашей компании технология стало популярна сразу же, после первого показа.