https://docs.google.com/document/pub?id=1Ot5TRE3ux6LNJTR1cPy-3ulNGyFRvmtq9vww9pfVYYs
При возникновении вопросов пишите их в комментарии к этому посту.
При возникновении вопросов пишите их в комментарии к этому посту.
bit.ly/dlog1 - Электронное обучение веб-разработке (с)2008-2015 Илья Государев
среда, 11 января 2012 г.
среда, 28 декабря 2011 г.
ММТВО | Одна идея и немного о будущем
Хочу поздравить с завершением первого семестра!
Во втором семестре мы много времени уделим таким технологиям для создания мультимедийного контента как Flash, Flex (а также другие современные инструменты от компании Adobe). Кроме того, мы рассмотрим как можно создавать мультимедийный контент средствами HTML5, CSS3, JavaScript.
На последнем занятии, была высказана идея для мультимедийного проекта по этой дисциплине. Желающие в количестве 2-3 человек могут взяться за реализацию данного проекта в качестве альтернативного варианта прохождения этого курса.
Суть проекта:
Разработать мультимедиа-гид по университету. Выбрать объекты, находящиеся на территории РГПУ, которые представляют интерес для гостей, студентов, абитуриентов. О каждом из них записать небольшой рассказ. Навигацию по территории реализовать в виде ссылок в ролике.
Пример проекта, где реализована подобная идея с навигацией: http://www.youtube.com/watch?v=AxH6mNt6x4E
С наступающим Новым Годом!
Во втором семестре мы много времени уделим таким технологиям для создания мультимедийного контента как Flash, Flex (а также другие современные инструменты от компании Adobe). Кроме того, мы рассмотрим как можно создавать мультимедийный контент средствами HTML5, CSS3, JavaScript.
На последнем занятии, была высказана идея для мультимедийного проекта по этой дисциплине. Желающие в количестве 2-3 человек могут взяться за реализацию данного проекта в качестве альтернативного варианта прохождения этого курса.
Суть проекта:
Разработать мультимедиа-гид по университету. Выбрать объекты, находящиеся на территории РГПУ, которые представляют интерес для гостей, студентов, абитуриентов. О каждом из них записать небольшой рассказ. Навигацию по территории реализовать в виде ссылок в ролике.
Пример проекта, где реализована подобная идея с навигацией: http://www.youtube.com/watch?v=AxH6mNt6x4E
С наступающим Новым Годом!
четверг, 15 декабря 2011 г.
суббота, 10 декабря 2011 г.
Курсовые работы (ММТвО, III курс ИТО)
http://dist-learn.blogspot.com/p/3.html#course
Сроки: к 15.12 - тема и описание продукта; к 15.01 - окончательный вариант (на CD продукт и электронный текст, а также адрес продукта или его описания в интернете + распечатанный текст в скоросшивателе).
Структура курсовой работы: вводная часть (цель, задачи, актуальность) + описание технологии/ПО + описание созданного продукта (со скриншотами).
Создаваемый продукт: мультимедийные инструкции (в виде веб-сайта) по пользованию OpenSource ПО. Включают:
Еще один пример (по другой дисциплине)
Примеры тем:
1. Разработка набора роликов учебного назначения в среде Flash и для HTML5
2. Разработка набора модулей в среде ОМС
3. Создание приложения для генерации веб-страниц с мультимедийным содержанием по заданной схеме
4. Кроссплатформенные реализации анимации на основе векторной графики (SVG)
5. Инструменты и примеры создания анимации для HTML5/CSS3 (Sencha Animator и т.д.)
Сроки: к 15.12 - тема и описание продукта; к 15.01 - окончательный вариант (на CD продукт и электронный текст, а также адрес продукта или его описания в интернете + распечатанный текст в скоросшивателе).
Структура курсовой работы: вводная часть (цель, задачи, актуальность) + описание технологии/ПО + описание созданного продукта (со скриншотами).
Создаваемый продукт: мультимедийные инструкции (в виде веб-сайта) по пользованию OpenSource ПО. Включают:
- краткую справку по описываемому продукту;
- непосредственно инструкции по решению типовых задач (краткий текстовый вариант + запись с экрана движений мыши + голосовое сопровождение);
- набор аннотированных ссылок на ресурсы.
Еще один пример (по другой дисциплине)
Примеры тем:
1. Разработка набора роликов учебного назначения в среде Flash и для HTML5
2. Разработка набора модулей в среде ОМС
3. Создание приложения для генерации веб-страниц с мультимедийным содержанием по заданной схеме
4. Кроссплатформенные реализации анимации на основе векторной графики (SVG)
5. Инструменты и примеры создания анимации для HTML5/CSS3 (Sencha Animator и т.д.)
четверг, 8 декабря 2011 г.
Немного анимации в стиле CSS3
Создайте пару элементов div с идентификаторами gr и bc и таблицу стилей:
#gr {height: 100px; border: ridge 3px;
background-image: -webkit-linear-gradient(rgba(255,255,255,.9), rgba(0,0,255,0));
border-radius: 20px; text-align: center; display:table-cell; vertical-align:middle;
}
#bc { font: bold 18px sans-serif;
height: 100px;
-webkit-animation-name: 'bc';
-webkit-animation-duration: 10s;
-webkit-animation-iteration-count: infinite;
}
@-webkit-keyframes 'bc' {
from {
background-color: white;
}
50% {
background-color: blue;
}
to {
background-color: white;
}
}
Это будет работать в Chrome. Для работы в других браузерах:
-o-
-ms-
-moz-
#gr {height: 100px; border: ridge 3px;
background-image: -webkit-linear-gradient(rgba(255,255,255,.9), rgba(0,0,255,0));
border-radius: 20px; text-align: center; display:table-cell; vertical-align:middle;
}
#bc { font: bold 18px sans-serif;
height: 100px;
-webkit-animation-name: 'bc';
-webkit-animation-duration: 10s;
-webkit-animation-iteration-count: infinite;
}
@-webkit-keyframes 'bc' {
from {
background-color: white;
}
50% {
background-color: blue;
}
to {
background-color: white;
}
}
Это будет работать в Chrome. Для работы в других браузерах:
-o-
-ms-
-moz-
понедельник, 28 ноября 2011 г.
Вниманию 4 курса! Тест и ДТвО
Уважаемые студенты!
Наступает декабрь. Между тем многие еще не выполнили первую часть работы по созданию теста в Javascript. Напомню идею: сначала мы создаем тест полностью на Javascript (генерация элементов управления, считывание вопросов с помощью AJAX), затем вводим JQuery, а затем переходим к серверной стороне - реализуем безопасную проверку на PHP и запись результатов в XML или MySQL.
Это задание имеет вариацию в дисциплине Дистанционные технологии в образовании. Там мы делаем вариант теста в формате SCORM, который можно загрузить в MOODLE.
Вот инструкция по созданию теста для Веб-дизайна: https://www.dropbox.com/s/u965i98t9g84b72/test_js_new.pdf
Вот инструкция по созданию SCORM-теста
http://dist-learn.spb.ru/moodle19/file.php/12/test_js_scorm.pdf
Курс в Moodle, содержащий пошаговые объяснения процесса импорта SCORM-пакетов
Наступает декабрь. Между тем многие еще не выполнили первую часть работы по созданию теста в Javascript. Напомню идею: сначала мы создаем тест полностью на Javascript (генерация элементов управления, считывание вопросов с помощью AJAX), затем вводим JQuery, а затем переходим к серверной стороне - реализуем безопасную проверку на PHP и запись результатов в XML или MySQL.
Это задание имеет вариацию в дисциплине Дистанционные технологии в образовании. Там мы делаем вариант теста в формате SCORM, который можно загрузить в MOODLE.
Вот инструкция по созданию теста для Веб-дизайна: https://www.dropbox.com/s/u965i98t9g84b72/test_js_new.pdf
Вот инструкция по созданию SCORM-теста
http://dist-learn.spb.ru/moodle19/file.php/12/test_js_scorm.pdf
У вас есть права создателей курсов в категории "РГПУ им. А.И. Герцена"
Ознакомьтесь с требованиями к курсам
Курс в Moodle, содержащий пошаговые объяснения процесса импорта SCORM-пакетов
Скринкасты к нему: импорт курса, импорт модуля
понедельник, 21 ноября 2011 г.
Неплохая статья/сайт о HTML5
Очень бодрая и веселая статейка. Вот выдержка
http://html5center.sourceforge.net/building-apps-in-html5
HTML5 is here, and the Web will never be the same.
You've no doubt heard that before, or something like it. I'd guess that when you did, you got excited, rolled your eyes, or mouthed the word "why?" and furrowed your brow a bit. Perhaps your reaction was a mix of all three.
http://html5center.sourceforge.net/building-apps-in-html5
Подписаться на:
Сообщения (Atom)