Coursera
Lista de cursos
  • Navegar
  • Pesquisar
  • For Enterprise
  • Entrar
  • Criar conta

Responsive Website Tutorial and Examples

Visão geralProgramaPerguntas frequentesDesenvolvedoresCustoClassificações e avaliações

Página inicialCiência da ComputaçãoDesenvolvimento Web e Móvel

Responsive Website Tutorial and Examples

Universidade de Londres, Goldsmiths, University of London

Informações sobre o curso: In this course, we will show you exciting examples of collaborative, interactive web applications that use various types of media including sound, images and big data. We will show you how to build sites that provide precisely this functionality, using Meteor. We will also provide fully working example application code that you can use for your own commercial web projects. The course also provides a range of advice and suggestions about how to develop bespoke web applications which match the requirements of clients, where clients are people who commission the product or people who use the product. We will take you through the development of the following applications: 1. A portfolio website with collaborative blogging functionality. 2. An interactive, realtime, multi user music remixing system. 3. An interactive, online graffiti wall where users can collaborate to create graphics. 4. An interactive data visualisation platform for exploring and plotting big data in exciting ways. At the end of this course, you will be able to: • Implement animated data visualisations and graphics using advanced user interface libraries such as vis.js • Work with external data sources • Create multi user, realtime, collaborative environments • Use media APIs such as the Web Audio API Participation in or completion of this online course will not confer academic credit for University of London programmes


Desenvolvido por:  Universidade de Londres, Goldsmiths, University of London
Universidade de LondresGoldsmiths, University of London

  • Dr Matthew Yee-King

    Ministrado por:  Dr Matthew Yee-King, Lecturer

    Computing Department, Goldsmiths, University of London

  • Dr Mick Grierson

    Ministrado por:  Dr Mick Grierson, Reader

    Computing Department, Goldsmiths, University of London
Informações básicas
Curso 5 de 6 no Responsive Website Development and Design Specialization
Compromisso4 weeks of study, 1-2 hours/week
Idioma
English
Como ser aprovadoSeja aprovado em todas as tarefas para concluir o curso.
Classificação do usuário
4.2 estrelas
Classificação média do usuário 4.2Veja o que os aprendizes disseram
Programa
SEMANA 1
Responsive Website Tutorials and Examples outline: Course overview
1 vídeo, 2 leituras, 1 questionário de prática
  1. Leyendo: Course outline
  2. Vídeo: Course overview
  3. Leyendo: Grading and assessment information
  4. Cuestionario de práctica: Prerequisite quiz
Creating a Portfolio Website with a Blog
Welcome to the first module of 'Responsive Website Tutorial and Examples!'. In this session we will be exploring a real-world web development task based on a common brief that web developers have to respond to every day – producing a portfolio website with both static and dynamic content features. I hope you enjoy the module! -Mick
6 vídeos, 5 leituras, 5 questionários de prática
  1. Vídeo: Introduction
  2. Cuestionario de práctica: Introduction
  3. Leyendo: Source code
  4. Leyendo: Slides for this module
  5. Vídeo: Recap
  6. Cuestionario de práctica: Recap
  7. Leyendo: Getting started: learning outcomes
  8. Vídeo: Getting started
  9. Cuestionario de práctica: Getting started
  10. Leyendo: Adding a page: learning outcomes
  11. Vídeo: Adding a page
  12. Cuestionario de práctica: Adding a page
  13. Leyendo: Administrating the blog and making it responsive: learning outcomes
  14. Vídeo: Administrating the blog and making it responsive
  15. Cuestionario de práctica: Administration
  16. Vídeo: Creating A Portfolio Website with Blog summary
Nota atribuída: Creating A Portfolio Website with Blog summary quiz
Nota atribuída: Customise the portfolio site
SEMANA 2
Collaborative Apps 1 : Music Machine
Welcome to the second module of 'Responsive Website Tutorial and Examples!'. Meteor is great at making collaboration simple. You can make collaborative sites in a day or so that work across many devices including mobile. By the end of this session you will understand how to structure and build collaborative, real-time applications, how to integrate the web audio API, and how to specifically set and get variables stored in the database using basic interface elements.
7 vídeos, 7 leituras, 5 questionários de prática
  1. Vídeo: Module introduction
  2. Vídeo: Introduction: Music Machine
  3. Cuestionario de práctica: Introduction
  4. Leyendo: Source code
  5. Leyendo: Slides for this module
  6. Leyendo: Project structure: learning outcomes
  7. Vídeo: Project structure
  8. Cuestionario de práctica: Project structure
  9. Leyendo: Adding sound: learning outcomes
  10. Vídeo: Adding sound
  11. Cuestionario de práctica: Adding sound
  12. Leyendo: Adding interaction : learning outcomes
  13. Vídeo: Adding interaction
  14. Cuestionario de práctica: Adding interaction
  15. Leyendo: Making it collaborative: learning outcomes
  16. Leyendo: URL in lecture video
  17. Vídeo: Collaboration
  18. Cuestionario de práctica: Making it collaborative
  19. Vídeo: Collaborative Apps 1 : Music Machine 2015 summary
Nota atribuída: Collaborative Apps 1 : Music Machine 2015 summary quiz
Nota atribuída: Customise the music machine
SEMANA 3
Collaborative Apps 2 : Drawing Machine
Welcome to the third module of 'Responsive Website Tutorial and Examples!'.Meteor allows us to make creative, collaborative apps that work in real-time. Both the Client and the Server can insert information into a Mongo collection. Ordinary web users can do this interactively, without having to program the database manually. In this session we will look at this approach through the lens of collaborative drawing. You will learn how to create a canvas using d3.js, change attributes of the canvas, create client code for inserting data into the database and how to render database entries as a drawing.
7 vídeos, 6 leituras, 5 questionários de prática
  1. Vídeo: Module introduction
  2. Vídeo: Drawing machine
  3. Cuestionario de práctica: Drawing machine introduction
  4. Leyendo: Source code
  5. Leyendo: Slides for this module
  6. Leyendo: Drawing machine example: learning outcomes
  7. Vídeo: Drawing machine: worked example
  8. Cuestionario de práctica: Drawing machine- worked example
  9. Leyendo: Creating the application: learning outcomes
  10. Vídeo: Creating the application
  11. Cuestionario de práctica: Creating the application
  12. Leyendo: Creating and serving data: learning outcomes
  13. Vídeo: Creating and serving data
  14. Cuestionario de práctica: Creating and serving data
  15. Leyendo: Review: learning outcomes
  16. Vídeo: Review
  17. Cuestionario de práctica: Review
  18. Vídeo: Collaborative Apps 2 : Drawing Machine summary
Nota atribuída: Collaborative Apps 2 : Drawing Machine summary quiz
Nota atribuída: Customise the drawing machine
SEMANA 4
Creating a Data Visualisation Application
Welcome to the final module of 'Responsive Website Tutorial and Examples!'.In this session we will be looking at how to use data from external sources to create interactive visualisations for the purposes of creating an interactive data visualisation web app.
7 vídeos, 6 leituras, 5 questionários de prática
  1. Vídeo: Recap of previous modules
  2. Vídeo: Module introduction
  3. Cuestionario de práctica: Introduction
  4. Leyendo: Source code
  5. Leyendo: Slides for this module
  6. Leyendo: Setting up the interface: learning outcomes
  7. Vídeo: Setting up the interface
  8. Cuestionario de práctica: Setting up the interface
  9. Leyendo: Getting data: learning outcomes
  10. Vídeo: Getting data
  11. Cuestionario de práctica: Getting data
  12. Leyendo: Rendering data on the page: learning outcomes
  13. Vídeo: Rendering data on the page
  14. Cuestionario de práctica: Rendering data on the page
  15. Leyendo: Review: learning outcomes
  16. Vídeo: Review
  17. Cuestionario de práctica: Review
  18. Vídeo: Creating a Data Visualisation Application summary
Nota atribuída: Creating a Data Visualisation Application summary quiz
Nota atribuída: Customise the data visualisation

Perguntas frequentes
Como funciona
Trabajo del curso
Trabajo del curso

Cada curso es como un libro de texto interactivo, con videos pregrabados, cuestionarios y proyectos.

Ayuda de tus compañeros
Ayuda de tus compañeros

Conéctate con miles de estudiantes y debate ideas y materiales del curso, y obtén ayuda para dominar los conceptos.

Certificados
Certificados

Obtén reconocimiento oficial por tu trabajo y comparte tu éxito con amigos, compañeros y empleadores.

Desenvolvedores
Universidade de Londres
The University of London is a federal University which includes 18 world leading Colleges. Our International Programmes were founded in 1858 and have enriched the lives of thousands of students, delivering high quality University of London degrees wherever our students are across the globe. Our alumni include 7 Nobel Prize winners. Today, we are a global leader in distance and flexible study, offering degree programmes to over 50,000 students in over 180 countries. To find out more about studying for one of our degrees where you are, search for 'London International'.
Goldsmiths, University of London
Championing research-rich degrees that provoke thought, stretch the imagination and tap into tomorrow’s world, at Goldsmiths we’re asking the questions that matter now in subjects as diverse as the arts and humanities, social sciences, cultural studies, computing, and entrepreneurial business and management. We are a community defined by its people: innovative in spirit, analytical in approach and open to all.
Custo
Comprar curso
Acesso aos materiais do curso

Disponível

Acesso a materiais valendo nota

Disponível

Receba uma nota final

Disponível

Obtenha um Certificado de Curso compartilhável

Disponível

Classificações e avaliações
Avaliado em 4.2 de 5 decorrente de 220 avaliações
Carlos Conejero

It is great, but, from my point of view, parts 1, 2, 3, 4 are a little better.

RS

Great and useful class! thank you!

Maria Jose Barrientos Vallejos

Excellent course :)

J

It is very practical



Talvez você também goste de
Universidade de Londres, Goldsmiths, University of London
Desenvolvimento Web Responsivo
1 curso
Universidade de Londres, Goldsmiths, University of London
Desenvolvimento Web Responsivo
Visualizar curso
University of Michigan
Introduction to CSS3
1 curso
University of Michigan
Introduction to CSS3
Visualizar curso
University of Michigan
Advanced Styling with Responsive Design
1 curso
University of Michigan
Advanced Styling with Responsive Design
Visualizar curso
University of Michigan
Interactivity with JavaScript
1 curso
University of Michigan
Interactivity with JavaScript
Visualizar curso
Universidade de Londres, Goldsmiths, University of London
Introdução ao Desenvolvimento com Meteor.js
1 curso
Universidade de Londres, Goldsmiths, University of London
Introdução ao Desenvolvimento com Meteor.js
Visualizar curso
Coursera
O Coursera proporciona acesso universal à melhor educação do mundo fazendo parcerias com as melhores universidades e organizações para oferecer cursos on-line.
© 2018 Coursera Inc. Todos os direitos reservados.
Baixar na App StoreBaixar no Google Play
  • Coursera
  • Sobre
  • Liderança
  • Carreiras
  • Lista de cursos
  • Certificados
  • Notas
  • Para negócios
  • For Government
  • Comunidade
  • parceiros
  • Orientadores
  • Tradutores
  • Desenvolvedores
  • Testadores beta
  • Conectar
  • Blog
  • Facebook
  • LinkedIn
  • Twitter
  • Google+
  • Tech Blog
  • Mais
  • Termos
  • Privacidade
  • Ajuda
  • Acessibilidade
  • Imprensa
  • Contato
  • Diretório
  • Afiliados