🔍Разыскиваются VueJs волонтеры!
EN в Twitter EN В Контакте EN в Facebook
Планета Земля // Россия // Тюмень // Публикации
RSS 2.0
Домен: https://72.en.cx/ (владелец домена: Jeffrey) Показать аватары
Модераторы форума: old_buddy, Jeffrey, Flashman, Поллитра, Ceron, Mstitel, Кот Василий, lena_776
На страницу: 
1  2  3  4

Создание и оформление заданий

Версия для печати
Автор: Организатор air  
Опубликована: 22 августа 2007 г.
Публикация прочитана: 1 541 450 раз



&nbsp
Основные темы публикации:




ОБЩАЯ ИНФОРМАЦИЯ



В каждом государстве существуют стандарты оформления документов, и мы все стараемся применять их в повседневной жизни и на работе. Документы написанные по стандартам легко и удобно читаются и понятны всем жителям страны. В нашем проекте, закрепились и активно используются некоторые схемы оформления уровней. Об этом и поговорим.

В играх типа «Мозговой штурм» хорошей традицией стало сообщать игрокам ответ на предыдущий уровень и давать паузу в 30-60 секунд, чтобы это осмыслить. Это реализуется так: В тексте второго уровня вы сообщаете ответ и комментарии на задание первого, а само задание второго уровня приходит в первой подсказке через минуту. В длительных виртуальных играх можно сделать паузу в 5 минут посередине игры, это пойдёт только на пользу игрокам.

При оформлении заданий обязательно указывайте форму и пример ответа, это обезопасит игроков от ввода правильного ответа в другом виде, падеже, склонении и т.д.

     ПРИМЕР:
     

Исключением может быть вопрос, в котором форма ответа и является частью загадки.

[вверх]



ТEKCT



Изменения параметров отображения текста начнём сразу с примеров, под примером будет размещён HTML-код, который надо вставить в поле редактирования задания, чтобы получилось так как указано в примере. Практически все коды можно комбинировать.

Вид текста:

     Пример: Обычный текст

Обычный текст


     Пример: Выделенный текст

<b>Выделенный текст</b>


     Пример: Наклонённый текст

<i>Наклонённый текст</i>


     Пример: Подчёркнутый текст

<u>Подчёркнутый текст</u>


     Пример: Зачёркнутый текст

<s>Зачёркнутый текст</s>


     Пример: Мигающий текст

<blink>Мигающий текст</blink>


     Пример: Выделенный, наклонённый, подчёркнутый текст

<b><i><u>Выделенный, наклонённый, подчёркнутый текст</u></i></b>



Размер шрифта можно указать так:

     Пример: Шрифт немного больше стандартного

<big>Шрифт немного больше стандартного</big>


     Пример: Шрифт немного меньше стандартного

<small>Шрифт немного меньше стандартного</small>


     Пример: Заданный размер шрифта

<font style="font-size: 16px;">Заданный размер шрифта</font>



Цвет шрифта выбирается так:

     Пример: Красный цвет

<font color="red">Красный цвета</font>


     Пример: Золотой цвет

<font color="gold">Золотой цвет</font>


     Можно указывать код цета, список основных цветов тут: https://en.wikipedia.org/wiki/Web_colors

     Пример: Цвет LawnGreen

<font color="#7CFC00">Цвет LawnGreen</font>



Дополнительные функции:

Размещение текста по центру экрана.
<center>
Размещение текста по центру экрана.</center>


     Пример: Горизонтальная черта (параметр size указывает толщину черты)


<hr size=2>




     Пример: Бегущая строка

<marquee direction="left" scrollamount="2" width="200">Бегущая строка</marquee>


     Пример:      Строка1
     Строка2

<marquee direction="up" scrollamount="2" height="15">Строка1<br>Строка2</marquee>



     Подробнее о возможностях тэга MARQUEE смотрите тут: https://www.htmlbook.ru/html/marquee.html



[вверх]


КАРТИНКИ



При оформлении заданий надо использовать картинки, они оживляют и украшают игру, делают её более привлекательной и понятной для игроков. В текст задания кроме обычных картинок (JPG, GIF, PNG) можно вставлять анимированные GIF-ы и Flash-анимацию. При использовании картинок необходимо учитывать следующие моменты:

  • Картинки не должны быть очень большими и занимать много места, ведь многие загружают их играя с dial-up модема или КПК. Максимальное разрешение для картинок в тексте задания 800 х 600 точек. Если вам в тексте задания нужно использовать много картинок или несколько больших – то лучше выдать их отдельными ссылками.
  • Имена файлов не должны быть простыми, ведь игроки могут подобрать их по ходу игры. Не забывайте следить за этим. Вот пример плохих имён для файлов с картинками: dom.jpg, znak.gif, shema.png, lev2.jpg, building1.jpg и т.д.


    Загрузка картинок на сайт.

    В текст задания можно вставлять ссылки на уже существующие на других сайтах картинки, а можно закачать свои прямо в игровой движок, и потом использовать их в тексте задания, делается это в меню Управлние Заданиями в Панели Администратора. Аналогочным способом можно закачать на сайт и файлы других форматов (SWF, MP3 и др.)





    Картинка автоматичсеки помещается в папку с игрой вида: https://example.en.cx/data/games/3340/ где 3340 – уникальный номер вашей игры.

    Когда картинка добавлена, её имя появляется в списке «Файлы для игры». Вы можете кликнуть на имени картинки, и она откроется в новом окне. Сохраните прямую ссылку на эту картинку – и потом вставьте её в текст уровня с помощью тега <img>.
    Вот пример прямой сслыки на загруженную картинку: https://example.en.cx/data/games/3340/korona.jpg


    Вставка картинок в текст задания.

         Пример: Ссылка на большую картинку. "Следующий уровень в США. Здесь вы получите дальнешие указания."
    <a href="https://cdn.endata.cx/images/personal/3/ny.jpg" target="_blank">Здесь</a> вы получите дальнешие указания.

         Пример: Просто вставка картинки.
         
    <img src="https://cdn.endata.cx/data/games/3340/korona.jpg" border="0" />

         Пример: Вставка картинки по центру экрана.
    <div align="center"><img src="https://cdn.endata.cx/data/games/3340/korona.jpg" border="0" /></div>

         Пример: Вставка картинки c сылкой на другую картинку (или страницу).
         
    <a href="https://cdn.endata.cx/data/games/3340/magazin.jpg" target="_blank"><img src="https://cdn.endata.cx/data/games/3340/korona.jpg" border="0" /></a>



         Пример: Анимированная GIF картинка (смайлик) вставлена в бегущую строку.     
    <marquee direction="right" scrollamount="2" width="800"><img src="https://kolobok.us/smiles/personal/pooh_go.gif" border="0" /></marquee>




    [вверх]


    МЕДИАФАЙЛЫ



    Звуковые и видео файлы, как и картинки, для удобства и гарантии одинакового доступа для всех участников, можно закачать на ваш игровой сайт. Как это делать смотрите в разделе Картинки.

    Встраивание звуковых файлов:

    Встроить midi-файл в текст задания можно следующим кодом:
    <embed src="https://cdn.endata.cx/data/games/2597/melodiy.mid" type="audio/x-midi" hidden="true" autostart="true" loop="true"></embed>

    Новый и более удобный способ вставки медиафайлов - тэг Audio
    Встроить mp3 и WMA файлы в текст задания можно так:
    <audio src="https://cdn.endata.cx/data/events/ensound2007/en.sound2007.1.mp3"></audio>


    или так (если ваш браузер не имеет plug-in для проигрывания mp3):

    <OBJECT id="MediaPlayer" WIDTH=320 HEIGHT=42 classid="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95" standby="Loading..." type="application/x-oleobject"><PARAM name="FileName" value="https://cdn.endata.cx/data/events/ensound2007/en.sound2007.1.mp3"><PARAM name="AutoStart" value="0">
    <EMBED type="application/x-mplayer2" src="https://cdn.endata.cx/data/events/ensound2007/en.sound2007.1.mp3" name="MediaPlayer" autostart="0" WIDTH=320 HEIGHT=42></EMBED></OBJECT>


    Вместо "https://en.cx/data/events/ensound2007/en.sound2007.1.mp3", подставляете имя своего файла (латиницей).
    Если необходимо автоматически запускать звуковой файл, параметр autostart="0", замените на autostart="1" или autostart="true"

    Пример:




    Встраивание видео файлов:

    Встроить в текст задания видео-сюжет из www.rutube.ru можно при помощи кода, который можно увидеть
    в самом файле на www.rutube.ru.
    Пример:



    <embed src="https://video.rutube.ru/9aa027b20b344cb140386b867554cd84" type="application/x-shockwave-flash" wmode="window" width="400" height="353" allowfullscreen="true" flashvars="uid=806578"/>



    Встраивание Flash-анимации (SWF файлов):

    Пример: Карта района г.Минска сделана на Flash. Вы можете закачать на сайт свой SWF файл и поменять сслыку в коде на него.

    <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="https://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="600" height="480" id="map3" align="middle"><param name="movie" value="https://cdn.endata.cx/images/personal/3/map3.swf"/><param name="quality" value="high" />
    <embed src="https://cdn.endata.cx/images/personal/3/map3.swf" quality="high" width="600" height="480" name="map3" align="middle" allowscriptaccess="sameDomain" type="application/x-shockwave-flash" pluginspage="https://www.macromedia.com/go/getflashplayer" /></object>


    Подробнее о возможностях тэга EMBED смотрите тут: https://www.htmlbook.ru/html/embed.html


    [вверх]


<<< Свернуть публикацию
Организатор
Мальчик
 air
Аттестат
[ 11.02.2008 15:14:12 (UTC +5), online.en.cx ]  
Laplace: Мне не нравится что руководство по оформлению заданий оформлено с таким существенным недостатком, что текст занимает по ширине более 1280 px.
у меня страница никак не умещается целиком по ширине.


Непонял причину наезда :) Только что поставкил 1024х768 - всё сформатировано и смотрицца нормально...

Laplace: А про встраивание звука - тоже плохо. У меня при каждом обновлении ЭТОЙ страницы он играется заново. Это значит, что я буду вынужден слушать его каждый раз, вбивая код. А если рядом несколько ноутов? :)


Перенёс проигрывание звука на отдельну страницу.

Laplace: Зачем нужны все эти мигающие и бегущие строки? ИМХО этому не место в подобном руководстве. Плюс несколько спорных утверждений (например про 5 мин паузу между заданиями МШ) может дезынформировать начинающих авторов.
Вместо руководства по цветам и проч лучше б сразу к стилям приучили (class="white" и др).


Надобность мигающих букв взята из опыта проведения игр. Например, когда в новостях или описаниии игры надо срочно вывесить важную новость - то мигающие красные буквы отлично подходят для этого. Про 5 минут всё очень корректно описано с применением слова "можете". Стили, скрипты (раскрывающиеся списки) это следующий этап. Если у вас есть варинаты компактного и простого кода для каких-либо фишек и прибамбасов к заданию - то присылайте, опубликуем.
Организатор
Мальчик
 air
Аттестат
[ 11.02.2008 15:43:35 (UTC +5), online.en.cx ]  
Justas: Огромная просьба написать как отключить автостарт в медиа файле. Чтоб он начинал играть только после нажатия кнопки Play.


для этого надо установить значение параметра autostart="0" (а не "false", как ошибочно было заявлено ранее) , это можно увидеть в примере https://world.en.cx/Addons.aspx?aid=1257
Майор
Мальчик
(
)
Аттестат
[ 11.02.2008 17:32:39 (UTC +5), pnz.en.cx ]  
Эйр, спасибо...
Организатор
Мальчик
 air
Аттестат
[ 11.02.2008 20:46:19 (UTC +5), online.en.cx ]  
Ширину починил, сообщения на это тему удалены, для удобства восприятия информации.
Младший лейтенант
Аттестат
[ 12.02.2008 14:19:32 (UTC +5), tbilisi.en.cx ]  
есть такой вопрос ... на свою игру я установил промо ролик ( можно увидеть тут https://tbilisi.en.cx ) для удобства пользователей нашего доменя я разместил видео на сайте аналогичном rutube.ru , учитывая локальный трафик пользователей 800 кбс б скорость скачивания\просмотра великолепная , хотелосьбы узнать возможно устроить так чтобы не создавая второго медиа окна, распознавалось с локального или глобального интернета зашел пользователь и автоматически мог просматреть ролик с тогоже рутуба или ютуба ? Смысл создать оптимально удобные условия для просмотра или прослушки медиа файлов с разных регионов на игре .
Организатор
Мальчик
 air
Аттестат
[ 12.02.2008 15:43:03 (UTC +5), online.en.cx ]  
Да, такое реализовать реально ... но тут HTMLу же не поможет, это делается всякими скриптами на языках web-программирования (JavaScript, PHP, Perl, ASP и т.д.) . Т.е. надо обращаться к профессионалам, или искать такие скрипты самому в нете. А проще выложить мувик для большинства пользователей сразу, а для остальных - просто предлагать посмотреть мувик по ссылке.
Капитан
Девочка
(
 Золотой Орден I степени
)
Золотой Орден I степени
Аттестат
[ 13.02.2008 11:56:44 (UTC +5), pnz.en.cx ]  
Спасибо огромное. наконец не нужно лазить по инету в поисков тегов, а потом коллекционировать их в ворде :) Теперь есть отличный справочник. давно пора
Капитан
Мальчик
Аттестат
[ 14.02.2008 20:31:04 (UTC +5), pnz.en.cx ]  
air! КРОСАВЧЕГ! Спасибо, реально задолбало по инету шариться в поисках, того или иного тега! Всем будующим авторам советую прочитать и сохранить! А то, иногда посмотришь аж плакать хочеться.
Капитан
Мальчик
(
)
Аттестат
[ 17.02.2008 0:50:07 (UTC +5), kuzbass.en.cx ]  
Хотелось бы увидеть руководство по созданию таблиц. Пример - правая часть главной страницы zlatoust.en.cx
И еще хотелось бы увидеть подобное руководство по офрмлению, только уже для администраторов и владельцев доменов
Майор
Мальчик
(
N21
)
Аттестат
[ 17.02.2008 17:35:40 (UTC +5), nn.en.cx ]  
+1
Майор
Мальчик
(
 Орден III степени
)
Аттестат
[ 18.02.2008 9:28:45 (UTC +5), pnz.en.cx ]  
respect)
Младший лейтенант
Мальчик
(
)
Аттестат
[ 20.02.2008 19:26:05 (UTC +5), nsk.en.cx ]  
Bоланд: Хотелось бы увидеть руководство по созданию таблиц. Пример - правая часть главной страницы zlatoust.en.cx
И еще хотелось бы увидеть подобное руководство по офрмлению, только уже для администраторов и владельцев доменов

Попробую ченить скреативить, на днях выложу
Младший лейтенант
Мальчик
[ 23.02.2008 11:12:10 (UTC +5), sm.en.cx ]  
Bоланд: Хотелось бы увидеть руководство по созданию таблиц. Пример - правая часть главной страницы zlatoust.en.cx
И еще хотелось бы увидеть подобное руководство по офрмлению, только уже для администраторов и владельцев доменов

Элементарно
Открываем нужную страничку напримере у нас https://zlatoust.en.cx
Ищем в браузере закладку Правка->Исходный текст(или источник, в разных браузерах по разному), или на крайняк сохраняем страницу на компе и открываем блокнотом и ищем нужные
В данном примере мы открыв это все видим :

<!-- ОБЪЯВЛЕНИЕ -->
<div align="center">
<div style="border:1px #006600 solid;border-bottom:none;text-align:center;width:170;background:#001c00;color:#ffff00;font-weight:bold;padding:5px">ОБЪЯВЛЕНИЕ</div>
<div style="border:1px #006600 solid;text-align:center;width:170;padding:5px;align:center;background:#092d00">
<a href="https://zlatoust.en.cx/Guestbook/Messages.aspx?topic=5697#165977">Приглашаются для сотрудничества Авторы и Организаторы игр.</a>
</div>

<br>
<!-- КОМАНДАМ -->
<div align="center">
<div style="border:1px #006600 solid;border-bottom:none;text-align:center;width:170;background:#001c00;color:#ffff00;font-weight:bold;padding:5px">КОМАНДАМ</div>
<div style="border:1px #006600 solid;text-align:center;width:170;padding:5px;align:center;background:#092d00"> <a href="https://d1.en.cx/images/personal/28669/Вэйвер.doc">Командный вейвер </a><br>
<br>
<a href="https://d1.en.cx/images/personal/30939/map1.jpg">Карта города </a><br>
<br>
<a href="https://d1.en.cx/images/personal/30939/map-flesh.swf">Карта города 2</a>
</div>



<br>

<!-- Турнирная таблица -->
<div align="center" style="padding:5px">
<div style="border:1px #006600 solid;border-bottom:none;text-align:center;width:90%;background:#001c00;color:#ffff00;font-weight:bold;padding:5px;">Турнир Евразия-2008
</div>
<div style="border:1px #006600 solid;width:90%;padding:5px;font-size:10px;text-align:left;background:#0D3B00">
по состоянию на 22.02.08г.
<br>
<br>30 - RKSport
<br>28 - $mart guy$
<br>20 - АГал-М
<br>18 - ZlatEN
<br>16 - Нам не спиЦо
<br>15 - Red&white
<br>10 - Zlatko
<br>_9 - АльтEрNатива
<br>_5 - Дикий гусЬ
<br>_5 - ProRabzzz
<br>_1 - ЛучшеNEбывает!
<br><a href="https://zlatoust.en.cx/Guestbook/Messages.aspx?topic=9421">подробнее</a>
<br>
<br>RKSport - лучшая команда января!
<br>
</div>
</div>

<!-- Игры домена -->
<div align="center" style="padding:5px">
<div styl
Лейтенант
Мальчик
(
)
Аттестат
[ 27.02.2008 5:04:08 (UTC +5), kms.en.cx ]  
Всем здрасте.
Дело было на нашем домене.
Мы начали менять дизайн правой панели. Пока я редактировал код вне дома, на большом экране, все было хорошо.
Придя домой заметил, что сайт не помещается на экран, а внизу горизонтальная полоса прокрутки.
Намудохался 2 дня, искал в своём коде ошибки.
Оказался всему виной преформатированный блок <pre>.
Баг это или не баг. Решать вам.
Но суть вот в чем:
Если в анонсе игры, который находится на главной странице, использовать преформатированный блок <pre>, то страничка не умещается на экранах, разрешением 1024х768 и меньше.
Блоки, заключенные в тэг <pre></pre>, используют для вставки различных сорцов в странички и тд.
Чтобы блок не портился при форматировании и масштабировании страницы и выглядел всегда так как написан.
Как сказал врач из известного анектода - "Не делайте так" .
Ну вобщем вот...
Надо это править в движке или не надо - решать не мне.
Но зато это заметка всем на будущее.
Подполковник
Мальчик
(
)
Аттестат
[ 01.03.2008 3:15:55 (UTC +5), karelia.en.cx ]  
Тема темы "Создание и оформление заданий", и, как мне кажется, она еще раскрыта не полностью. Первому слову тут уделили уж совсем мало строк.
Не в обиду авторам, но во многих играх задания (играл или просто читал сценарии) были однотипными (т.е. фоторяд, словесный обыгрыш слов и т.п.), или научно-свойски закрученный смысл слов, или просто "содраные" с инета факты по своим тематикам...
Конечно, все это отражается на оценке игры, пусть и не всегда.
Следуя теме темы - СОЗДАНИЕ - хотелось, чтобы "аффторы" (как тут любят обзывать авторов игр) пользовались всем особенностями окружающего мира (ИМХО). Это сделало бы более интересными игры, чем, то, как разбираться в сплошной игре слов.
Может я и зануда. Но это форум, а это мое ИМХО.
Еще раз - никого не хотел обидеть.
Да здравствует ИГРА!
Организатор
Мальчик
 air
Аттестат
[ 01.03.2008 9:12:12 (UTC +5), online.en.cx ]  
akriz: Может я и зануда.


ничего страшного.. мы "девы" все такие зануды :)
Капитан
(
)
Орден II степени
Аттестат
[ 08.04.2008 19:14:40 (UTC +5), komi.en.cx ]  
сложно :( не по моим мозгам...
Капитан
Мальчик
(
)
Аттестат
[ 22.10.2008 23:36:53 (UTC +5), 66.en.cx ]  
А как сделать один бонус доступный для введения на всю игру, (в схватке)? видел такое на МШ.
Рядовой
Мальчик
[ 15.12.2008 12:47:23 (UTC +5), oq.en.cx ]  
СПС, нуная информация, особенно по поводу медиа )
Старший лейтенант
(
)
Аттестат
[ 23.05.2009 17:18:57 (UTC +5), kuzbass.en.cx ]  
Скажите пожалуйста, как создать кнопку автоввода ответа
На страницу: 
1  2  3  4
01.11.2024 10:35:09
(UTC +5)

www.en.cx
EncounterTM Ltd.
2004-2024 ©