Содержание темы 1 Примеры использования сервиса. Подготовка исходных данных и#nbsp;материалов. Создание таблицы Google на#nbsp;основе заданного шаблона. Заполнение таблицы исходных данных. Заполнение таблицы дат и#nbsp;промежутков времени. Выбор медиа-ресурсов и#nbsp;их#nbsp;описание. Заполнение таблицы заголовков и#nbsp;описаний. Группы, фоны, пиктограммы. Заголовочный слайд. Передача кода таблицы сервису. Настройка внешнего вида оси времени. Габариты, язык, шрифты, начальные условия, адресация. Получение кода оси времени и#nbsp;вставка его в#nbsp;свой ресурс. Дополнительные рекомендации по#nbsp;использованию различных источников медиа в#nbsp;TimeLineJS.

1. Будем знакомы!
Каллиников Павел, автор и ведущий курса
komail@gmail.com
https://www.facebook.com/kallinikov
Наш курс называется:
Профессиональная разработка электронного
учебного контента II ― 2017
10 вебинаров: Вт. и Чт. 15.00 MSK
Мы будем общаться здесь:
https://www.facebook.com/groups/1786212415024629/
Материалы курса располагаются здесь:
http://contentium.tilda.ws/page175655.html

2. Сертификаты

3. Высшая школа экономики, Москва, 2015
Сертификаты

4. Наш курс
ВЕБИНАРЫ
• 23 мая в 15.00 MSK
• 25 мая в 15.00 MSK
• 30 мая в 15.00 MSK
• 1 июня в 15.00 MSK
• 6 июня в 15.00 MSK
• 8 июня в 15.00 MSK
• 13 июня в 15.00 MSK
• 15 июня в 15.00 MSK
• 20 июня в 15.00 MSK
• 22 июня в 15.00 MSK

5. Наш курс
РАЗДЕЛЫ
• Оси времени
• Виртуальные
путешествия
• Интерактивные
изображения
высокой чёткости
• Интерактивные карты
• Компоновка
контента, лонгриды

6. Каллиников П.Ю.
Тема 1. Ось времени TimeLineJS
ВЕБИНАР 23.05.2017 15.00 MSK
Профессиональная разработка
электронного учебного контента II ―
2017

7. Полезные ссылки 1/2
• Статьи:
• http://telegra.ph/Hronografiya-02-16
• http://telegra.ph/Tajmlajny-02-22
• Примеры timeline «ручного» изготовления
• http://research.google.com/bigpicture/music/#
• http://bolid.es/
• https://youtu.be/gbxr157Iu3A
• Интернет сервис для профессионального применения TimeLine JS
• TimelineJS: http://timeline.knightlab.com/
• Короткий учебный ролик про сервис TimeLine JS (ENG):
http://youtu.be/vAWbm4gF9lU
• Альтернативныe сервисы для работы с осями времени:
• Timeglider: http://timeglider.com/
• Tiki-Toki: http://www.tiki-toki.com/
• Timetoast: https://www.timetoast.com/
• TimeRime: http://timerime.com/
• Sutori4: https://www.sutori.com/

8. Полезные ссылки 2/2
• Серия скринкастов, посвященная разработке timeline при помощи dipiti.com
• Ролик 1/5: http://youtu.be/rHTJDUsC4dg
• Ролик 2/5: http://youtu.be/6IS4WmW_SsE
• Ролик 3/5: http://youtu.be/3RRDxi-mDWk
• Ролик 4/5: http://youtu.be/KcCdTdB9VsE
• Ролик 5/5: http://youtu.be/24tGQ8LzoT8
• Серия скринкастов, посвященная разработке timeline при помощи TimeLineJS
• Ролик 1/5: https://youtu.be/jGYJPTNIGes
• Ролик 2/5: https://youtu.be/yHcIkoNTjHE
• Ролик 3/5: https://youtu.be/SKa9M6Y7coQ
• Ролик 4/5: https://youtu.be/HfMPmKJJ43g
• Ролик 5/5: https://youtu.be/6qwfAY9UD6A

9. Метафора электронного обучения
«Ось времени»

10. Метафора электронного обучения
«Ось времени»

11. Метафора электронного обучения
«Ось времени»

12. Метафора электронного обучения
«Ось времени»

13. Сервис для создания timeline:
http://www.dipity.com/

14. Продвинутый сервис TimelineJS

15. TimelineJS: создание таблицы событий
по шаблону

16. TimelineJS: создание таблицы событий
по шаблону

17. TimelineJS: создание таблицы событий
по шаблону

18. TimelineJS: вставка своих данных

19. TimelineJS: публикация таблицы в сети

20. TimelineJS: публикация таблицы в сети

21. TimelineJS: публикация таблицы в сети
• Вариант 1
https://docs.google.com/spreadsheets/d/1fW5r
f1HX7_Z04djXQmQLOZQDPbt4ZLT9v0ix_YIu
9YU/pubhtml
• Вариант 2
https://docs.google.com/spreadsheets/d/1fW5r
f1HX7_Z04djXQmQLOZQDPbt4ZLT9v0ix_YIu
9YU/edit#gid=0
Оба варианта работают! – проверено
23.05.2017

22. TimelineJS: копирование адреса таблицы
Вариант 1

23. TimelineJS: копирование адреса таблицы
Вариант 2

24. TimelineJS: копировать адрес
таблицы в сервис

25. TimelineJS: дополнительные настройки 1

26. TimelineJS: дополнительные настройки 2

27. TimelineJS: код вставки оси времени

28. TimelineJS: предварительный вид

29. TimelineJS: вставка кода в страницу курса

30. TimelineJS: вставка кода в страницу курса

31. TimelineJS: вставка кода в страницу курса

32. TimelineJS: вставка кода в страницу курса

33. Практикум 1
Cоздать ось времени из 10–20 событий на
заданную или свободную тему в сервисе
TimeLineJS

34. TimelineJS-медиа: варианты

35. TimelineJS-медиа: варианты

36. TimelineJS-медиа: варианты

37. TimelineJS-медиа: варианты

38. TimelineJS-медиа: варианты

39. TimelineJS-медиа: варианты

40. TimelineJS-медиа: варианты

41. TimelineJS-медиа: варианты

42. TimelineJS-медиа: варианты

43. TimelineJS-медиа: варианты

44. TimelineJS-медиа: варианты

45. TimelineJS-медиа: варианты

46. TimelineJS-медиа: варианты

47. TimelineJS-медиа: варианты

48. TimelineJS-медиа: варианты

49. TimelineJS-медиа: варианты

50. TimelineJS-медиа: варианты

51. TimelineJS-медиа: варианты

52. TimelineJS-медиа: варианты

53. TimelineJS-медиа: варианты

54. TimelineJS-медиа: варианты

55. TimelineJS-медиа: варианты

56. TimelineJS-медиа: варианты

57. Практикум 1
Cоздать ось времени из 10–20 событий на
заданную или свободную тему в сервисе
TimeLineJS

58. © 2017, Каллиников Павел Юрьевич
+7 (903) 546-81-84 моб
 komail@gmail.com
https://www.facebook.com/kallinikov
Вопросы?