Design a Web Page to Update Live Based on Video Playback Counter.

  • Статус: Closed
  • Винагорода: $190
  • Надіслані роботи: 2
  • Переможець: kayecandy

Стисле описання конкурсу

Below I’ll describe a preliminary design for an educational web site that shows an updating commentary as a video plays. The initial job is as follows: review & comment on the design and outline a technical approach and selection of technologies to implement it. A simple initial proof of concept version of site functionality is described in the ‘basic functionality’ section that will be implemented once an approach is agreed upon.

Implementation Guidelines:

The site should run on all popular browsers including mobile versions and comply with core web standards to ensure longevity and reduce maintenance. Recent browser versions may be assumed. It is preferred that it be implemented entirely in stock clients so no server customization, code, or browser plugins are needed. The preferred video system is YouTube. These requirements will be reconsidered if shown to be too restrictive.

Basic Functionality:

The web page is divide into three sections; at the top is an embedded video window with standard navigation/scrubbing tools including a full-screen option. Below that is a region that shows a window into a scrollable html document containing a commentary that will be updated as the video plays, i.e. as various timecodes become current. Below that is another region that shows an external web site in a window that is also updated as the video plays.

A basic usage scenario is as follows: The video starts, and shows a picture of the planet Mars 10 seconds from the beginning. When the counter reads 00:00:10 this triggers the middle section to update to load a comment that says “This is Mars, this image came from the following NASA web page:” and the bottom section is updated to show a page from [login to view URL] (this url having been read from a hidden tag in the comment file.)

The user then scrolls the middle comment window down until they come across a comment titled ‘Venus.’ If the user clicks on the word ‘Venus’, the video is scrubbed to a timecode indicated in an xml tag in that comment. The lower section is then updated as before, this time to show a page from another site, e.g. [login to view URL] or www.wikipedia.org.

For a few more details see the attached PDF

Рекомендовані навички:

Відгук роботодавця

“Candice was great to work with. She is both knowledgable and helpful.”

Зображення профілю adrianmw, United States.

Найкращі роботи цього конкурсу

Переглянути більше заявок

Публічна роз'яснювальна дошка

  • adrianmw
    Організатор конкурсу
    • 5 місяці(в) тому

    I have updated the Project Overview PDF to add detail to following sections: 'Major Design Decisions' and the final 'Commentary Combinations and File Generation' section.

    • 5 місяці(в) тому
  • kayecandy
    kayecandy
    • 5 місяці(в) тому

    Using iframes would be a problem since alot of major sites would disable their content from being loaded in an iframe. I'm just assuming the bottom section is for further information on the video? Does it need to be interactive? Maybe an image (or screenshot of the page) instead?

    • 5 місяці(в) тому
    1. adrianmw
      Організатор конкурсу
      • 5 місяці(в) тому

      Hi, yes this is a problem. nasa.gov is one of the key sites I wish to reference and they do block iframes. But others are fine (wikipedia for example.) We could do a screenshot but people will want to click on the links. So another possible solution is to open all the web pages in a pop-up window rather than the lower region. We’d would need to keep control of that window even when people navigate (within nasa.gov for example) to prevent lots of pop-ups being created. I am not sure if this can be done reliably. There may be other solutions.

      • 5 місяці(в) тому
    2. adrianmw
      Організатор конкурсу
      • 5 місяці(в) тому

      Thank you for your help demonstrating the pop-up idea can work. Unfortunately, as it requires people to disable pop-ups I'd like to continue looking for other solutions.

      • 5 місяці(в) тому
  • adrianmw
    Організатор конкурсу
    • 5 місяці(в) тому

    To clarify: this competition/fee is just for the initial research and a proposal on how you'd implement the functionality I describe. Once that's decided the actual implementation will be for an additional fee.

    • 5 місяці(в) тому
  • adrianmw
    Організатор конкурсу
    • 5 місяці(в) тому

    A very rough mockup (using obsolete frames) can be seen here: http://www.theplanetsonline.com.

    • 5 місяці(в) тому
    1. frire
      frire
      • 5 місяці(в) тому

      hi, please see my rough demonstration #1

      • 5 місяці(в) тому
    2. adrianmw
      Організатор конкурсу
      • 5 місяці(в) тому

      Thank you Upmaka, that's great to see some of the functionality actually working! For this competition I'm hoping to receive a document that describes how you would implement the other functionality I describe too. May I suggest adding notes to my PDF document? There will be some challenges, for example I have learned that nasa.gov does not permit its pages to be shown in iframes. I would like to know if there is a reasonable way to still show nasa.gov in the lower region.

      • 5 місяці(в) тому
  • adrianmw
    Організатор конкурсу
    • 5 місяці(в) тому

    My guess is it will be in html5 and javascript using the YouTube embedded player.

    • 5 місяці(в) тому
  • adrianmw
    Організатор конкурсу
    • 5 місяці(в) тому

    Hi, this first task is just a detailed technical proposal for how to implement the functionality I describe. Graphic design will come later. Thanks.

    • 5 місяці(в) тому

Більше коментарів

Як організувати конкурс

  • Опублікуйте свій конкурс

    Опублікуйте свій конкурс Швидко та просто

  • Отримайте безліч конкурсних робіт

    Отримайте безліч конкурсних робіт З усього світу

  • Оберіть найкращу роботу

    Оберіть найкращу роботу Завантажуйте файли - це просто!

Опублікувати конкурс зараз або приєднуйтесь до нас вже сьогодні!