Introdução a Visualização de Dados: Teoria e Prática. Nicole Sultanum

Tamanho: px
Começar a partir da página:

Download "Introdução a Visualização de Dados: Teoria e Prática. Nicole Sultanum"

Transcrição

1 Introdução a Visualização de Dados: Teoria e Prática Nicole Sultanum Jornada de Informática na Biodiversidade LNCC 13 de Fevereiro de 2015

2 Golden rules of visualization tools (by Enrico Bertini) Ferramentas vão mudar! Não existe o melhor absoluto para todo mundo

3 Ferramentas Excel Infogr.am R (ggplot2) Tableau D3 Processing VTK/Paraview

4 Excel Não primariamente, ou somente visualização Difundido Mais poderoso do que se pensa mas não é tão simples sair do básico.

5 infogr.am Ferramenta Web para criação de charts básicos Free (com assinatura para versão PRO) Simples!

6 R (ggplot2) Não primariamente, ou somente visualização Biblioteca de plotting do R Diagramas prédefinidos, mas consideravelmente customizáveis Somente 2D Python tem biblioteca similar: matplotlib! qplot(x, y, data=, color=, shape=, size=, alpha=, geom=, method=, formula=, facets=, xlim=, ylim= xlab=, ylab=, main=, sub=)!

7 Visualização sem programação (drag & drop)! Mais madura, profissional e completa ferramenta de visualização do mercado Complexa! Cara! Mas tem licença para estudantes J! Tableau

8 Javascript (Web) Específico para visualização D3 Data Driven Documents Flexibilidade, grande comunidade, extensiva lista de exemplos

9 Processing Java-like (originalmente dextro.org Image by Marius Watz: https://wildinwoods.wordpress.com/category/infographics-data-visualization/ baseado em Java, hoje porta para várias outras plataformas) Desenvolvimento gráfico de propósito geral (não somente visualização de dados) 2D e 3D

10 VTK / Paraview

11 Comparação entre ferramentas Dados Complexid. Expressiv. Plataforma Free? Linguagens Excel T Desktop VBA Infogr.am T Web (limitado) --- R (ggplot2) T Desktop (GPL-2) R Tableau TM Dskt, Web (15d trial) --- D3 TMG (3) Web (BSD) Javascript Processing TMG3 Dskt, Web (MIT) Java/JS/Python VTK/ Paraview 3 (TMG) Dskt (Web) (BSD) C++ T Tabela, M Mapa/Campo G Grafo, 3 Dados 3D

12 D3 vs. Processing D3! Processing! Tipos de gráfico Vetorial Raster (primariamente) Suporte a 3D +- Sim Suporte a Web Sim Sim (javascript) Interação Via eventos Ciclo de updates Comunidade no Stk. Ov. (complexidade?) 818 páginas 158 páginas Aprendizado Complicado! Simples J Eficiência/Escala Centenas de formas Após overhead inicial, milhares de formas com performance constante

13 Introdução a Visualização de Dados: Teoria e Prática Prática D3

14 Objetivo Aprender a utilizar recursos básicos da tecnologia implementando exemplos simples Incremental vários pequenos exercícios Aprender o bastante para ser autosuficiente (ou mais próximo disso)

15 D3 D3 allows you to bind arbitrary data to a Document Object Model (DOM), and then apply data-driven transformations to the document. D3 is not a monolithic framework that seeks to provide every conceivable feature. Instead, D3 solves the crux of the problem: efficient manipulation of documents based on data. Javascript SVG HTML CSS

16 SVG Gráficos vetoriais por linguagem de marcação rect! circle! ellipse! line! gradient! text! polygon! polyline! path! g (grupo de formas)

17 CSS Define estilos e layout para liguagens de marcação web.class #id Color opacity Border Font-style Font-family Text-align

18 D3 Conceitos básicos D3 não é uma biblioteca de desenho: Mapeamento de um objeto de dado a um elemento do DOM Declarativo, não imperativo Você não desenha, mas sim, especifica como quer que o desenho seja feito Fluxo básico Criar um canvas SVG Seleção de elementos de atuação no DOM (elementos podem ainda não existir). Mapear seleção aos dados: Para cada elemento; Especificação dos atributos visuais, classes ; Associar a eventos;

19 D3 rodando o primeiro programa Código-fonte! Output!

20 D3 rodando o primeiro programa em detalhes Array de dados Criação de um canvas SVG no <body> (onde as formas são efetivamente desenhadas) Criação dos elementos rect (retângulos); Um para cada dado contido no array data! (i.e. mapeamento dados <-> gráficos!) Funcão definindo comportamento do atributo (poderia ter sido uma função anônima)

21 D3 rodando o primeiro programa em detalhes d3.select("body")! Seleciona o elemento <body> do nó principal do documento (DOM) <body>.append("svg")! Adiciona um novo elemento do tipo SVG à seleção (no caso, o nó <body> do DOM) <svg>.attr( width, 400)! Adiciona um novo atributo ao elemento correspondente https://github.com/mbostock/d3/wiki/selections

22 D3 rodando o primeiro programa em detalhes svg.selectall("rect")! Seleciona (dentro do nó svg) todos os elementos de tag rect. Gera uma seleção de elementos de DOM (neste caso, vazia!)! <sel>.data(data)! Mapeia a seleção de DOMs ao conjunto de dados especificado. <sel>.enter()! Se #dados > #elementos DOM, um novo placeholder é criado: <d>.append("rect")! Utiliza o placeholder criado e adiciona um elemento rect. <d>.attr( width,20)! Modifica atributo width com valor constante, 20. <d>.attr( width,20)! bblablbllablal

23 select() selectall()! Seleções! d3.select(selector)! d3.selectall(selector)!! var svg = body.select("svg");! var rects = svg.selectall(".bars");!!!! d3.select(node)! d3.selectall(node)!! body.select(svg);! svg.selectall(rects);! https://github.com/mbostock/d3/wiki/selections Operações sobre seleções! selection.append(name)! "selection.append( text ); //ou svg:text!! selection.attr(name[,val])! "selection.attr( width, 100); "selection.attr( width ); //returns 100!! selection.style(name[,val[,prior]])! "selection.style({'stroke': 'black',! " " " 'stroke-width': 2,! " " "});!! selection.classed(name[,val])! "selection.classed( bars, true);!! // Tem mais! Checa o link ali do lado!

24 select() selectall()! Operações sobre seleções! selection.append(name)! "selection.append( text ); //ou svg:text!! selection.attr(name[,val])! "selection.attr( width, 100); "selection.attr( width ); //returns 100!! selection.style(name[,val[,prior]])! "selection.style({'stroke': 'black',! " " " 'stroke-width': 2});!! selection.classed(name[,val])! "selection.classed( bars, true);!! // Tem mais! Checa o link ali do lado! Valores podem ser funções selection.attr( x,! "function(d,i){! " "//d <- dado! " "//i <- indice! " "return i * 25;! "});!!! function()! function(d) function(d,i)

25 Exercício 1 5 min Adaptar o código fornecido para criar um diagrama de barras representando os dados; function()! function(d) function(d,i) Y = ybottom- height ybottom selection.attr(name[,val])! "selection.attr( width, 100); "selection.attr( x, function(d,i){! " "return i * 25;! "});!!! selection.style(name[,val[,prior]])! "selection.style({'stroke': 'black',! " " " 'stroke-width': 2,! " " " 'fill': red });!

26 Exercício 1

27 attr()! atributos específicos atributos globais https://developer.mozilla.org/pt-br/docs/web/svg

28 text()!

29 style() classed() ==

30 Exercício 2 7 min Adicionar texto com o valor numérico de cada dado; separar o estilo.

31 Exercício 2

32 Reorganizando

33 d3.scale()! Scales are functions that map from an input domain to an output range domain (input) range (output) Quantitativa Domínio contínuo d3.scale.linear()! d3.scale.pow()! d3.scale.quantile()! d3.scale.threshold()!.! Ordinal Domínio Discreto d3.scale.ordinal()! Temporal Domínio temporal d3.time.scale()! https://github.com/mbostock/d3/wiki/scales

34 d3.scale() Mapeando um atr. quantitativo a uma escala numérica (e.g. pixels) Mapeando um atr. ordinal a uma escala numérica Mapeando um atr. quantitativo a cor (divergente) Mapeando um atr. ordinal a cor

35 d3.scale.ordinal() d3.scale.category10()! d3.scale.category20()! d3.scale.category20b()! d3.scale.category20c()! + ColorBrewer! Every ColorBrewer Scale: https://github.com/mbostock/d3/wiki/ordinal-scales

36 Exercício 3 10 min Use escalas para mapear: No. items [1,10] ao comprimento [10,250];! Dados [0,9] à altura das barras [20,150];! Dados a cor [#253494, #41b6c4, #c2e699]!

37 Exercício 3

38 Reorganizando

39 d3.svg! Helper functions to generate and manage SVG shapes Formas d3.svg.line()!! g.append("path")!.attr("d", line);!! d3.svg.area()! d3.svg.arc()! d3.svg.chord()!! Eixos!! d3.svg.axis()!! axis.scale([scale])! axis.orient([orientation])! axis.ticks([arguments ])! axis.tickvalues([values])! axis.tickformat([format])! Brush d3.svg.brush()!! https://github.com/mbostock/d3/wiki/svg

40 d3.svg.axis() axis.scale([scale])!! A função d3.scale() que descreve o eixo axis.orient([orientation])! [ top, bottom, left, right ]! Posicionamento dos ticks (marcações). https://github.com/mbostock/d3/wiki/svg-axes axis.ticks([arguments ])! axis.tickvalues([values])! Determina número de marcações. Em tickvalues(), um array arbitrário de marcações pode ser informado, e.g.: axis.tickvalues([2,4,5,8,10]);!

41 d3.svg.axis()

42 Exercício 4 10min Adicionar eixos X e Y ao diagrama de barras: axis.tickvalues([values])!

43 Exercício 4

44 Interatividade selection.on(type[, listener[, capture]])! Example adapted from: Qualquer evento DOM suportado pelo seu browser: mousedown! mouseenter! mouseleave! mousemove! mouseout! mouseup! Entre outros https://developer.mozilla.org/en-us/docs/ Web/Events#Standard_events

45 Interatividade selection.on(type[, listener[, capture]])! this à a seleção correspondente When a function is used as an event handler, its this is set to the element the event fired from. https://developer.mozilla.org/en-us/docs/web/javascript/reference/operators/this Example adapted from:

46 Exercício 5 5min Highlight de barras com borda vermelha quando mouse passar por cima; sem borda quando sair.

47 Exercício 5

48 Formatos de dados - JSON JSON (JavaScript Object Notation) is a lightweight data-interchange format. It is easy for humans to read and write. It is easy for machines to parse and generate. Objeto Membros Array Par id (string) : valor

49 Formatos de dados - Tabelas CSV Comma Separated Values TSV Tab Separated Values Date,Wound,Field,Disease 5/1854,0,95,105 6/1854,0,40,95 7/1854,0,140,520 8/1854,20,150,800 9/1854,220,230,740 10/1854,305,310,600 11/1854,480,290,820 12/1854,295,310,1100 1/1855,230,460,1440 Date Wound Field Disease 5/ / / / / / / / /

50 Carregando Tabelas! d3.csv() d3.tsv()! Função de carregamento url [opc] parse Callback após dados dados por linha carregados Forma alternativa Dados são sempre carregados como string por isso a necessidade de um parser customizado por linha Object {! "sepallength: 5.1, "sepalwidth: 5.1, "petallength: 1.4, "petalwidth: 0.2,! "species: "setosa"! }! https://github.com/mbostock/d3/wiki/csv

51 Carregando dados! d3.csv() d3.tsv() d3.json() d3.xml() Dados são carregados assincronamente, de forma que o resto do código da página possa carregar enquanto os dados são processados. Código que depende dos dados deve ser rodado a partir da função de callback (passada na solicitação do carregamento), enquanto o resto do código roda imediatamente. https://github.com/mbostock/d3/wiki/requests

52 Funções auxiliares para arrays De Javascript arr.sort([comparefunction])! arr.pop()! arr.push(el1,..., eln)! arr.reverse()! arr.slice([begin[, end]])! arr.indexof(el[,fromid=0])! arr.filter(callback[, arg])! arr.foreach(callback[, arg])!! De D3 d3.min(array[, accessor])! d3.max(array[, accessor])! d3.extent(array[, accessor])! d3.sum(array[, accessor])! d3.median(array[, accessor])!! https://developer.mozilla.org/en-us/docs/web/ JavaScript/Reference/Global_Objects/Array https://github.com/mbostock/d3/wiki/arrays

53 Exercício 06 (final) - scatterplot Carregar dados do iris.tsv e gerar o gráfico abaixo: (X-sepalWidth, Y-sepalLength, hue-species)

54 Exercício 06 (final) - scatterplot (X- sepalwidth, Y- sepallength, hue- species) d3.min(array[, accessor])! d3.max(array[, accessor])! d3.extent(array[, accessor])! d3.scale.category10()!

55

56 Exercício 06 (final) - scatterplot

57 Outros tópicos Mapas Layouts radiais Grafos Projeções de mapa Transições Brushing & Linking https://github.com/mbostock/d3/wiki/gallery

58 Outros tópicos Dados dinâmicos Mapas Layouts radiais Grafos Projeções de mapa Transições Brushing & Linking

59 Excelente introdução a D3 Murray, Scott. Interactive data visualization for the Web. " O'Reilly Media, Inc.", 2013.

60

61 Introdução a Visualização de Dados: Teoria e Prática Prática Processing

62 Processing Gráficos raster baseado em opengl Inicialmente construído em cima de Java, hoje roda também em: Javascript (Web), Android, Python, Ruby. Construído para: Ser simples API minimal, low entry point Expressividade gráfico-interativa Portanto.. bastante popular entre artistas gráficos Inspirado/baseado em OpenGL Propósito geral, i.e. não exclusivo de visualização de dados

63 Processing Onde baixar: processing.org! (Windows, Linux, Mac OS)

64 Processing IDE Play/Stop Arquivos de um sketch Output (java, javascript, Android ) Adicionar/ remover arquivos ao sketch Também é possível usar o Eclipse (com alguns ajustes ) Console Erros

65 Primeiro programa em Processing Abrir a referência: processing.org/reference/

66 Formas Primitivas ellipse(a, b, c, d)! arc(a, b, c, d, start, stop)! rect(a, b, c, d)! line(x1, y1, x2, y2)! bezier(x1, y1, x2, y2, x3, y3, x4, y4)! quad(x1, y1, x2, y2, x3, y3, x4, y4)! triangle(x1, y1, x2, y2, x3, y3)! text(c, x, y)!...! Algumas têm mais de um construtor rect(a, b, c, d)! rect(a, b, c, d, r)! rect(a, b, c, d, tl, tr, br, bl)! processing.org/reference/

67 ! Configurações são globais como em OpenGL fill()! nofill()! stroke()! nostroke()! strokeweight()! strokejoin()! strokecap()! colormode()//rgb, HSB!...!!

68

69 ! Configurações são globais como em OpenGL fill()! nofill()! stroke()! nostroke()! strokeweight()! strokejoin()! strokecap()! colormode()//rgb, HSB!...!!

70 Configurações são globais como em OpenGL! ellipsemode()! rectmode()!

71 color é um tipo primitivo R:250 G:0 B:0 A:255 R:200 G:200 B:200A:255 R:0 G:0 B:255 A:100

72 Exercício 1 10min 400x ellipse(cx,cy,rx,ry)! rect(x,y,w,h)! triangle(x1,y1,x2,y2,x3,y3)! arc(cx,cy,rx,ry,a1,a2)!! fill(g)! fill(r,g,b)! nofill()! stroke(g)! stroke(r,g,b)! strokeweight(w)! nostroke()!!

73 Exercício 1

74 Carregando dados https://processing.org/reference/loadtable_.html

75 Mapeamentos (com dados) map(value, start1, stop1, start2, stop2)! lerp(start,stop,amt)! lerpcolor(start,stop,amt)!

76 Exercício 2 20 min Carregar o arquivo mammals.csv e criar um scatterplot simples com: X = Weight Average (kg) (float) Y = Length Average (m) (float) cor = Conservation Level (int) 40,200,40 255,0, ,100,255 Conservation Level Status! 1 - Least Concern 2 Vulnerable 3 - Near Threatened 4 - Endangered 5 Critically Endangered 6 Extinct 0 - Data Deficient map(value, start1, stop1,! " start2, stop2)! lerp(start,stop,amt)! lerpcolor(start,stop,amt)!

77 Exercício 2

78 Interatividade Capturando eventos de mouse/teclado

79 Interatividade Eventos de mouse/teclado Mouse! mouseclicked()! mousedragged()! mousemoved()! mousepressed()! mousepressed! mousereleased()! mousewheel()! Teclado! keypressed()! keypressed! keyreleased()! keytyped()!!

80 Interatividade Acessando valores de mouse/keyboard Mouse! mousex! mousey! pmousex! pmousey! (pmousex,pmousey) (mousex,mousey) Teclado! key! keycode! UP, DOWN, LEFT, RIGHT, ALT, CONTROL, SHIFT, PAGE_UP, PAGE_DOWN, HOME, END! l L! <left click>

81 Exercício 3 5 min Modificar o Ex. 2 para exibir a coordenada (X,Y) do espaço de dados (não pixels) quando mouse clicar em um ponto dentro do diagrama. mousex! mousey!

82 Modificar o Ex. 2 para exibir a coordenada (X,Y) do espaço de dados (não pixels) quando mouse clicar em um ponto dentro do diagrama. Exercício 3

83 Um outro exercício bem mais trabalhoso! Não se preocupe, não faremos ele hoje! Modificar o Ex. 2 para, quando o mouse fizer hover em um ponto no gráfico, exibir um popup com a ordem do elemento correspondente. Por que é complicado?! Raster -> pixels, não elementos É preciso fazer testes de colisão manualmente Oclusão! Quem está na frente? Gestão de ordem de desenho Carnivora Nessas horas o D3 começa a se tornar bem mais vantajoso para visualização de dados

84 O que mais é possível fazer: Bibliotecas diversas: Processamento de imagem Mapas GUI Dispositivos de input leap motion, kinect, etc. Simulação física 2D Shaders 3D Áudio Visão computacional Bancos de dados SQL Charts Entre outros https://processing.org/reference/libraries/

85 https://processing.org/reference/ Mais métodos

86 https://processing.org/tutorials/ Tutoriais

azevedolab.net 2015 Dr. Walter F. de Azevedo Jr.

azevedolab.net 2015 Dr. Walter F. de Azevedo Jr. azevedolab.net 2015 Dr. Walter F. de Azevedo Jr. 1 Ementa Apresentação de outras linguagens de programação para Bioinformática: introdução ao Perl e ao Processing; modelagem de sistemas biológicos; aplicações

Leia mais

dados abertos cartilha para desenvolvedores

dados abertos cartilha para desenvolvedores dados abertos cartilha para desenvolvedores Esta publicação é um encarte integrante do Manual dos dados abertos: desenvolvedores, resultante do acordo de cooperação técnico-científica entre o Laboratório

Leia mais

Minicurso introdutório de desenvolvimento para web em HTML5. Cristiano Costa

Minicurso introdutório de desenvolvimento para web em HTML5. Cristiano Costa Minicurso introdutório de desenvolvimento para web em HTML5 Cristiano Costa Sobre mim Graduando em Engenharia Eletrônica - UNIFEI Trabalhou em desenvolvimento de sistemas empresariais (Base em servidores

Leia mais

Aula 03: Noções Fundamentais do CSS, Formatação de Fonte e Inserção de Imagens

Aula 03: Noções Fundamentais do CSS, Formatação de Fonte e Inserção de Imagens Aula 03: Noções Fundamentais do CSS, Formatação de Fonte e Inserção de Imagens Tag para inserir imagens e HTML O modelo CSS Noções fundamentais e funcionamento do CSS Incluindo estilos em uma página Sintaxe

Leia mais

Universidade Federal do Rio de Janeiro NCE/PGTIAE. Tutorial SweetHome3D

Universidade Federal do Rio de Janeiro NCE/PGTIAE. Tutorial SweetHome3D Universidade Federal do Rio de Janeiro NCE/PGTIAE Tutorial SweetHome3D Trabalho apresentado ao Prof. Carlo na Disciplina de Software Livre no curso Pós Graduação em Tecnologia da Informação Aplicada a

Leia mais

Inaulab #1! Code, Processing intro!

Inaulab #1! Code, Processing intro! Inaulab #1! Code, Processing intro! Helder Dias! helvis@netcabo.pt! 7 de Julho 2012, 9:30-13:00! - anológico vs. digital! - programação, código e algoritmia! - Processing IDE! - variáveis, ciclos, condições

Leia mais

AJAX JSON JQUERY. Prof. Fellipe Aleixo (fellipe.aleixo@ifrn.edu.br)

AJAX JSON JQUERY. Prof. Fellipe Aleixo (fellipe.aleixo@ifrn.edu.br) AJAX JSON JQUERY Prof. Fellipe Aleixo (fellipe.aleixo@ifrn.edu.br) QUAL O OBJETIVO DESTAS TECNOLOGIAS? AJAX AJAX = Asynchronous Javascript and XML Não é uma nova linguagem de programação, apenas uma nova

Leia mais

Lista de Revisão. 3. Analise a afirmativa a seguir como verdadeira ou falsa e justifique.

Lista de Revisão. 3. Analise a afirmativa a seguir como verdadeira ou falsa e justifique. Lista de Revisão 1. Nos sistemas web, geralmente os usuários apresentam dois problemas típicos, a desorientação e a sobrecarga cognitiva. Discorra sobre esses problemas. 2. Apresente as principais diferenças

Leia mais

Curso: Especializado Desenvolvimento de Aplicações para Android

Curso: Especializado Desenvolvimento de Aplicações para Android Curso: Especializado Desenvolvimento de Aplicações para Android Duração: 66h Área formativa: Programação Web & Mobile Sobre o curso Desde o lançamento dos smartphones no mercado, é crescente a procura

Leia mais

Observações importantes:

Observações importantes: Fundação CECIERJ - Vice Presidência de Educação Superior a Distância Curso de Tecnologia em Sistemas de Computação Disciplina Criação de Páginas de WEB AD1 1 semestre de 2014. Observações importantes:

Leia mais

INTRODUÇÃO AO DESENVOLVIMENTO DE JOGOS COM LIBGDX. Vinícius Barreto de Sousa Neto

INTRODUÇÃO AO DESENVOLVIMENTO DE JOGOS COM LIBGDX. Vinícius Barreto de Sousa Neto INTRODUÇÃO AO DESENVOLVIMENTO DE JOGOS COM LIBGDX Vinícius Barreto de Sousa Neto Libgdx é um framework multi plataforma de visualização e desenvolvimento de jogos. Atualmente ele suporta Windows, Linux,

Leia mais

Curso rapidíssimo de Processing

Curso rapidíssimo de Processing Curso rapidíssimo de Processing Primeira parte: bolas 1. Instale: http://processing.org/download/. 2. Crie uma pasta processing, ao lado da sua pasta sources (a dos programas C). 3. Abra o Processing.

Leia mais

Até agora aprendemos formas para nomear e processar dados em Javascript.

Até agora aprendemos formas para nomear e processar dados em Javascript. Manipular HTML Recapitulando Até agora aprendemos formas para nomear e processar dados em Javascript. Os tipos de dados primários de que falámos (String, Number e Boolean) são exactamente isso - pequenas

Leia mais

5 Detalhes da Implementação

5 Detalhes da Implementação Detalhes da Implementação 101 5 Detalhes da Implementação Neste capítulo descreveremos detalhes da implementação do Explorator que foi desenvolvido usando o paradigma MVC 45 e o paradigma de CoC 46 (Convention

Leia mais

HTML5. André Tavares da Silva. andre.silva@udesc.br

HTML5. André Tavares da Silva. andre.silva@udesc.br HTML5 André Tavares da Silva andre.silva@udesc.br O que é HTML5? HTML5 será o novo padrão para HTML, XHTML e HTML DOM (Document Object Model). A última versão (4.01) foi definida em 1999 e a Web mudou

Leia mais

Um Framework LGPL Multiplataforma. Wagner Reck

Um Framework LGPL Multiplataforma. Wagner Reck Um Framework LGPL Multiplataforma Wagner Reck Resumo O que é Breve histórico Principais Módulos e Ferramentas Novidades por vir Qt is......a cross platform application and UI framework qt.nokia.com/products...a

Leia mais

Microsoft Visual Studio Express 2012 for Windows Desktop

Microsoft Visual Studio Express 2012 for Windows Desktop Microsoft Visual Studio Express 2012 for Windows Desktop Apresentação da ferramenta Professor: Danilo Giacobo Página pessoal: www.danilogiacobo.eti.br E-mail: danilogiacobo@gmail.com 1 Introdução Visual

Leia mais

Início Rápido Desktop. 2015 Release 1 Xojo, Inc.

Início Rápido Desktop. 2015 Release 1 Xojo, Inc. Início Rápido Desktop 2015 Release 1 Xojo, Inc. Capítulo 1 Introdução Bem-vindo ao Xojo, O jeito mais fácil de criar aplicativos multi-plataforma para Desktop e Web. Seção 1 Sobre o Início Rápido para

Leia mais

Programação Web Aula 5 - Javascript Parte 2 - Javascript e HTML

Programação Web Aula 5 - Javascript Parte 2 - Javascript e HTML Programação Web Aula 5 - Javascript Parte 2 - Javascript e HTML Departamento de Informática UFPR 17 de Março de 2014 1 Javascript e HTML 2 Ambiente Hierarquia Propriedades de Document 3 DOM Denição Hierarquia

Leia mais

Dominando Action Script 3

Dominando Action Script 3 Dominando Action Script 3 Segunda Edição (2014) Daniel Schmitz Esse livro está à venda em http://leanpub.com/dominandoactionscript3 Essa versão foi publicada em 2014-05-02 This is a Leanpub book. Leanpub

Leia mais

JavaScript (Funções, Eventos e Manipulação de Formulários)

JavaScript (Funções, Eventos e Manipulação de Formulários) Linguagem de Programação para Web JavaScript (Funções, Eventos e Manipulação de Formulários) Prof. Mauro Lopes 1-31 23 Objetivos Iremos avançar um pouco mais em nosso estudo sobre o JavaScript. Iremos

Leia mais

Arduino e Processing. Professor: Paulo Marcos Trentin Escola CDI Videira

Arduino e Processing. Professor: Paulo Marcos Trentin Escola CDI Videira Arduino e Processing Professor: Paulo Marcos Trentin Escola CDI Videira O que é Processing? É uma linguagem criada em 2001 por Casey Reas e Benjamin Fry, na época estudantes do MIT. Seu objetivo é server

Leia mais

DESENVOLVIMENTO WEB I - 7122

DESENVOLVIMENTO WEB I - 7122 6.2 - Formulários: Um dos recursos mais fascinantes da linguagem HTML é a possibilidade de criar formulários eletrônicos. Usando um formulário o usuário pode interagir com o servidor, enviando dados que

Leia mais

files, que devolve um objeto do tipo FileList.

files, que devolve um objeto do tipo FileList. WEB STORAGE 199 7.4.3 FILE API A File API foi introduzida para nos fornecer maior flexibilidade no acesso ao conteúdo de ficheiros a partir de uma página HTML. Por predefinição, o acesso a um ficheiro

Leia mais

Desenvolvimento de Aplicações para Internet

Desenvolvimento de Aplicações para Internet Desenvolvimento de Aplicações para Internet Aula 03 Celso Olivete Júnior olivete@fct.unesp.br Na aula de hoje... Javascript: introdução, operadores lógicos e matemáticos, comandos condicionais. Javascript:

Leia mais

6.2 - Formulários: form
...
form action method POST GET exceto outros formulários form

6.2 - Formulários: form <form action=url_de_script method=método>...</form> form action method POST GET exceto outros formulários form 6.2 - Formulários: Um dos recursos mais fascinantes da linguagem HTML é a possibilidade de criar formulários eletrônicos. Usando um formulário o usuário pode interagir com o servidor, enviando dados que

Leia mais

Webdesign HTML. Introdução a HTML e as principais tags da linguagem. Thiago Miranda dos Santos Souza

Webdesign HTML. Introdução a HTML e as principais tags da linguagem. Thiago Miranda dos Santos Souza Webdesign HTML Introdução a HTML e as principais tags da linguagem Conteúdos Os materiais de aula, apostilas e outras informações estarão disponíveis em: www.thiagomiranda.net Objetivos Apresentar a HTML

Leia mais

Conceitos de Ajax Exemplos de uso do Ajax no braço, muitos exemplos, muito código (HTML, CSS, JavaScript, PHP, XML, JSON)

Conceitos de Ajax Exemplos de uso do Ajax no braço, muitos exemplos, muito código (HTML, CSS, JavaScript, PHP, XML, JSON) Márcio Koch 1 Currículo Formado na FURB em Ciência da Computação Pós graduado em Tecnologias para o desenvolvimento de aplicações web Mestrando em Computação Gráfica na UDESC Arquiteto de software na Senior

Leia mais

4.14 - Imagens: src único atributo que não pode ser omitido neste TAG Nota: img

4.14 - Imagens: <img src=...> src <img src=tecnologia.jpg> único atributo que não pode ser omitido neste TAG Nota: img 4.14 - Imagens: O TAG utilizado para a inclusão de imagens em páginas html é o: O atributo src especifica o local onde está a imagem e o seu nome. Nas páginas pessoais é mais comum o uso

Leia mais

Joaquim Muchaxo. Mapas.SAPO.pt

Joaquim Muchaxo. Mapas.SAPO.pt API de Mapas do Sapo e exemplos de integração Joaquim Muchaxo Mapas.SAPO.pt Resumo Introdução I - Widget do SAPO Mapas II - Os mapas como Web-Services I) API de Mapas Cliente: - HTML / DOM / CSS - Javascript

Leia mais

Guia de Consulta Rápida. PHP com XML. Juliano Niederauer. Terceira Edição. Novatec

Guia de Consulta Rápida. PHP com XML. Juliano Niederauer. Terceira Edição. Novatec Guia de Consulta Rápida PHP com XML Juliano Niederauer Terceira Edição Novatec Copyright 2002 da Novatec Editora Ltda. Todos os direitos reservados e protegidos pela Lei 9.610 de 19/02/1998. É proibida

Leia mais

4.14 - Imagens: SRC único atributo que não pode ser omitido neste tag Nota: img

4.14 - Imagens: <IMG SRC=...> SRC <IMG SRC=tecnologia.jpg> único atributo que não pode ser omitido neste tag Nota: img 4.14 - Imagens: O tag utilizado para a inclusão de imagens em páginas html é o: O atributo SRC especifica o local aonde está a imagem e o seu nome. Nas páginas pessoais é mais comum o uso

Leia mais

Comandos Draw. Prof. Msc. Rogério Simões Departamento de Engenharia de Produção e Sistemas

Comandos Draw. Prof. Msc. Rogério Simões Departamento de Engenharia de Produção e Sistemas Comandos Draw As primitivas geométricas são os elementos geométricos que compõem um desenho. Entre elas, podemos citar linhas, arcos, textos, círculos, etc. Esses comandos estão no menu Draw e alguns deles

Leia mais

Web Design. Prof. Felippe

Web Design. Prof. Felippe Web Design Prof. Felippe 2015 Sobre a disciplina Fornecer ao aluno subsídios para o projeto e desenvolvimento de interfaces de sistemas Web eficientes, amigáveis e intuitivas. Conceitos fundamentais sobre

Leia mais

Sumário. HTML CSS JQuery Referências IHC AULA 6 5-09-2011 1

Sumário. HTML CSS JQuery Referências IHC AULA 6 5-09-2011 1 Sumário HTML CSS JQuery Referências IHC AULA 6 5-09-2011 1 Linguagem HTML HTML é a abreviação de HyperText Markup Language, que pode ser traduzido como Linguagem de Marcação de Hipertexto. Não é uma linguagem

Leia mais

Adobe Flex. Cainã Fuck dos Santos Thiago Vieira Puluceno Jonathan Kuntz Fornari Gustavo Nascimento Costa

Adobe Flex. Cainã Fuck dos Santos Thiago Vieira Puluceno Jonathan Kuntz Fornari Gustavo Nascimento Costa Adobe Flex Cainã Fuck dos Santos Thiago Vieira Puluceno Jonathan Kuntz Fornari Gustavo Nascimento Costa O que é Flex? Estrutura de Código aberto para a criação de aplicativos Web Utiliza o runtime do Adobe

Leia mais

Introdução à Tecnologia Web HTML HyperText Markup Language XHTML extensible HyperText Markup Language Seção do Corpo Estrutura da Página

Introdução à Tecnologia Web HTML HyperText Markup Language XHTML extensible HyperText Markup Language Seção do Corpo Estrutura da Página IntroduçãoàTecnologiaWeb HTML HyperTextMarkupLanguage XHTML extensiblehypertextmarkuplanguage SeçãodoCorpo EstruturadaPágina ProfªMSc.ElizabeteMunzlinger ProfªMSc.ElizabeteMunzlinger SeçãodoCorpo EstruturadaPágina

Leia mais

Coleção - Análises de email marketing em clientes de email

Coleção - Análises de email marketing em clientes de email Coleção - Análises de email marketing em clientes de email Introdução Nesta sexta e penúltima edição da Coletânea de Análises de Email Marketing em Clientes de Email, apresentamos os estudos dos clientes

Leia mais

Cenário atual de uso e das ferramentas de software livre em Geoprocessamento

Cenário atual de uso e das ferramentas de software livre em Geoprocessamento Cenário atual de uso e das ferramentas de software livre em Geoprocessamento Tiago Eugenio de Melo tiago@comunidadesol.org 1 Sumário Conceitos GIS e Software Livre Ferramentas: Jump Qgis Thuban MapServer

Leia mais

Aula de ArcGIS Criando uma planta de um

Aula de ArcGIS Criando uma planta de um Aula de ArcGIS Criando uma planta de um topográfico Prof. Frederico D. Bortoloti Introdução No menu Iniciar, vá no grupo de programas ArcGIS e clique em ArcMap No ArcMap, feche a janela inicial. Passo

Leia mais

<link rel=stylesheet type=text/css href=imagens.css /> Este código é responsável pela visualização html. exibição de Imagens

Leia mais

Módulo: Criação de Páginas WEB

Módulo: Criação de Páginas WEB Módulo: Criação de Páginas WEB 50 Horas - Sessão 05/13 TEXTO ANIMADO O comando MARQUEE orienta o browser a definir o efeito de texto/imagem a passar no ecrã. Deve ser utilizado quando queremos dar destaque

Leia mais

Responsive Web Design

Responsive Web Design Professor: http://jemaf.github.com DESENVOLVIMENTO DE APLICAÇÕES WEB - INFORMATICA - COLTEC/UFMG 2014 Introdução Atualmente, a web é acessada de qualquer lugar, em qualquer dispositivo. Acesso a web: Anos

Leia mais

Introdução ao Mapserver

Introdução ao Mapserver Introdução ao Mapserver SigWeb by João Araujo 2/28 Mapserver Ambiente de desenvolvimento para construção de aplicações espaciais voltadas para WEB; Não é um GIS completo, nem tem este objetivo; Criado

Leia mais

Programação para Dispositivos Móveis Aula 1. Prof. William Yamamoto

Programação para Dispositivos Móveis Aula 1. Prof. William Yamamoto Programação para Dispositivos Móveis Aula 1 Prof. William Yamamoto Visual Studio É uma ferramenta de desenvolvimento completa que atende praticamente a todas as plataformas de desenvolvimento, como: Web

Leia mais

Introdução 1ª Parte Web Web Web Web Browsers Editores Editores Etiquetas (tags) base indica que se trata de uma página escrita em linguagem HTML. Esta deve abranger todo o código;

Leia mais

Software Livre e GIS: Quais são as alternativas?

Software Livre e GIS: Quais são as alternativas? Software Livre e GIS: Quais são as alternativas? Tiago Eugenio de Melo tiago@comunidadesol.org 1 Sumário Conceitos GIS e Software Livre Ferramentas: Thuban Qgis Jump MapServer O Futuro das Tecnologias

Leia mais

2 Trabalhos Relacionados

2 Trabalhos Relacionados 2 Trabalhos Relacionados Os trabalhos relacionados podem ser classificados em três categorias: abordagens baseadas em metamodelos para a definição de formalismos, uso de metamodelos em editores de diagrama

Leia mais

Conteúdo. DHTML tópicos Hamilton Lima - 2002-2004

Conteúdo. DHTML tópicos Hamilton Lima - 2002-2004 DHTML tópicos Hamilton Lima - 2002-2004 Conteúdo 1. meu primeiro script... 2 2. DOM Document Object Model...2 3. tipo de execução de scripts...2 4. resposta a um evento... 3 5. tipos de dados, variaveis

Leia mais

Capítulo 4. Programação em ASP

Capítulo 4. Programação em ASP Índice: CAPÍTULO 4. PROGRAMAÇÃO EM ASP...2 4.1 REGISTRAR...2 4.1.1 Códigos para configuração do objeto...2 4.1.2 Formulário para transferir dados da impressão digital...3 4.1.3 Código Javascript para registro

Leia mais

Coleção - Análises de email marketing em clientes de email

Coleção - Análises de email marketing em clientes de email Coleção - Análises de email marketing em clientes de email Introdução Nesta útima edição da Coletânea de Análises de Email Marketing em Clientes de Email, apresentamos os estudos dos clientes Yahoo! Mail

Leia mais

Para acessar o NVU clique em Iniciar >> Programas >> Editor de Internet, iniciando aparecerá a seguinte tela:

Para acessar o NVU clique em Iniciar >> Programas >> Editor de Internet, iniciando aparecerá a seguinte tela: 1 APOSTILA NVU Cobra Tecnologia, www.cobra.com.br Última revisão em 12 de Julho de 2005 DESCRIÇÃO: O NVU é uma ferramenta que foi criada para web designers e para desenvolvedores de aplicações para o ambiente

Leia mais

Introdução. História. Como funciona

Introdução. História. Como funciona Introdução O HTML é uma linguagem de marcação utilizada para desenvolvimento de sites. Esta linguagem surgiu junto com o HTTP, ambos possibilitaram a internet ser popularizada. História O HTML foi criado

Leia mais

Esse update é 10: Novos applets e JavaFX

Esse update é 10: Novos applets e JavaFX Esse update é 10: Novos applets e JavaFX Jorge Diz Instrutor Globalcode Objetivos Objetivos: Mostrar o que vem por ai no desktop/ browsertop Ver se os applets agora vão pegar Onde está JavaFX? Agenda >Applets:

Leia mais

TECNOLOGIAS WEB. Unidade 2 Introdução a Construção de Páginas Estáticas. Luiz Leão luizleao@gmail.com http://luizleao.com

TECNOLOGIAS WEB. Unidade 2 Introdução a Construção de Páginas Estáticas. Luiz Leão luizleao@gmail.com http://luizleao.com Luiz Leão luizleao@gmail.com http://luizleao.com CONTEÚDO PROGRAMÁTICO DESTA UNIDADE HTML TAG S HTML LINGUAGEM HTML Hypertext Markup Language Interpretada pelo navegador Não linearidade da informação Formatação

Leia mais

Desenvolvimento e disponibilização de Conteúdos para a Internet

Desenvolvimento e disponibilização de Conteúdos para a Internet Desenvolvimento e disponibilização de Conteúdos para a Internet Por Matheus Orion Principais tecnologias front-end HTML CSS JAVASCRIPT AJAX JQUERY FLASH JAVA APPLET Linguagens que executam no cliente HTML

Leia mais

Métodos da classe Applet Criando applets Passando parâmetros de uma página HTML Migrando de uma aplicação para uma applet Applets vs.

Métodos da classe Applet Criando applets Passando parâmetros de uma página HTML Migrando de uma aplicação para uma applet Applets vs. Applets Métodos da classe Applet Criando applets Passando parâmetros de uma página HTML Migrando de uma aplicação para uma applet Applets vs. Segurança l Objetivos Migrar de uma aplicação para uma applet

Leia mais

Aula 1 - Introdução e configuração de ambiente de desenvolvimento

Aula 1 - Introdução e configuração de ambiente de desenvolvimento Aula 1 - Introdução e configuração de ambiente de desenvolvimento Olá, seja bem-vindo à primeira aula do curso para desenvolvedor de Android, neste curso você irá aprender a criar aplicativos para dispositivos

Leia mais

PROJETO PEDAGÓGICO DE CURSOS

PROJETO PEDAGÓGICO DE CURSOS 1 de 5 PROJETO PEDAGÓGICO DE CURSOS BURITREINAMENTOS MANAUS-AM DEZEMBRO / 2014 2 de 5 PACOTES DE TREINAMENTOS BURITECH A Buritech desenvolveu um grupo de pacotes de treinamentos, aqui chamados de BuriPacks,

Leia mais

Curso Superior de Tecnologia em Análise e Desenvolvimento de Sistemas Prof. Felippe Scheidt IFPR Campus Foz do Iguaçu 2014/2

Curso Superior de Tecnologia em Análise e Desenvolvimento de Sistemas Prof. Felippe Scheidt IFPR Campus Foz do Iguaçu 2014/2 Curso Superior de Tecnologia em Análise e Desenvolvimento de Sistemas Prof. Felippe Scheidt IFPR Campus Foz do Iguaçu 2014/2 Objetivo. O objetivo da disciplina é conhecer os princípios da programação de

Leia mais

Introdução à Tecnologia Web HTML HyperText Markup Language XHTML extensible HyperText Markup Language Seção do Corpo Imagens

Introdução à Tecnologia Web HTML HyperText Markup Language XHTML extensible HyperText Markup Language Seção do Corpo Imagens IntroduçãoàTecnologiaWeb HTML HyperTextMarkupLanguage XHTML extensiblehypertextmarkuplanguage SeçãodoCorpo Imagens ProfªMSc.ElizabeteMunzlinger ProfªMSc.ElizabeteMunzlinger SeçãodoCorpo Imagens Índice

Leia mais

jquery André Tavares da Silva andre.silva@udesc.br

jquery André Tavares da Silva andre.silva@udesc.br jquery André Tavares da Silva andre.silva@udesc.br jquery jquery é uma biblioteca em JavaScript; Seu objetivo é simplificar a programação em JavaScript; jquery foi desenvolvida para ser de aprendizado

Leia mais

Apostila CSS - Introdução à folha de estilos

Apostila CSS - Introdução à folha de estilos Apostila CSS - Introdução à folha de estilos Este documento é propriedade intelectual do Núcleo de Educação a distância da NRsystem e distribuído sob os seguintes termos: 1. As apostilas publicadas pelo

Leia mais

#Aula Nº 3 Estilo CSS webstandards.samus.com.br webstandards.samus.com.br/aulas/aula3.pdf Vinicius Fiorio Custódio samus@samus.com.

#Aula Nº 3 Estilo CSS webstandards.samus.com.br webstandards.samus.com.br/aulas/aula3.pdf Vinicius Fiorio Custódio samus@samus.com. #Aula Nº 3 Estilo CSS webstandards.samus.com.br webstandards.samus.com.br/aulas/aula3.pdf Vinicius Fiorio Custódio samus@samus.com.br #Objetivo Apresentar os conceitos de utilização do CSS, Sintaxe, Seletores

Leia mais

Home Page da Estação Automática do IF-SC

Home Page da Estação Automática do IF-SC Home Page da Estação Automática do IF-SC Ana Paula Jorge Fraga Email: anaa_fraga@hotmail.com Artur da Silva Querino E-mail: arturquerino@gmail.com Kathilça Lopes de Souza E-mail: kathii16@hotmail.com Rayana

Leia mais

Construindo um sistema simples de cadastro de fornecedores em PHP e MySQL.

Construindo um sistema simples de cadastro de fornecedores em PHP e MySQL. Construindo um sistema simples de cadastro de fornecedores em PHP e MySQL. Procuraremos mostrar os principais procedimentos para fazer um cadastro de registros numa base de dados MySQL utilizando a linguagem

Leia mais

Workshop Processing: Visualização de Dados e Interatividade

Workshop Processing: Visualização de Dados e Interatividade Workshop Processing: Visualização de Dados e Interatividade Imagens Claudio Esperança Programa de Engenharia de Sistemas e Computação COPPE / UFRJ Escola de Belas Artes Claudio Esperança (PESC/COPPE/UFRJ)

Leia mais

DHTML - MÓDULO 1: VISÃO GERAL E INTRODUÇÃO Por Marcelo Camargo Visão geral

DHTML - MÓDULO 1: VISÃO GERAL E INTRODUÇÃO Por Marcelo Camargo Visão geral Apostila retirada de http://www.ibestmasters.com.br DHTML - MÓDULO 1: VISÃO GERAL E INTRODUÇÃO Por Marcelo Camargo Visão geral A tecnologia DHTML (Dynamic HTML) foi apresentada inicialmente como um conjunto

Leia mais

[CURSO DE FÉRIAS FIREWORKS] JULHO / 2011

[CURSO DE FÉRIAS FIREWORKS] JULHO / 2011 Conteúdo 1. OBJETIVO DO FIREWORKS... 2 1.1 - Diferença entre imagem Vetorial e Bitmap... 2 1.2 - Formato de Arquivos... 3 2. AMBIENTE DO FIREWORKS... 3 2.1 - INICIANDO UM PROJETO... 4 3. DESENHANDO NO

Leia mais

Introdução Padrões OGC Instalação Configuração Formatos de Saída Aplicação AGENDA

Introdução Padrões OGC Instalação Configuração Formatos de Saída Aplicação AGENDA Introdução ao Introdução Padrões OGC Instalação Configuração Formatos de Saída Aplicação AGENDA INTRODUÇÃO GeoServer GeoTools INTRODUÇÃO GeoServer Servidor de informação geoespacial OGC; Utilizado para

Leia mais

Coleção - Análises de email marketing em clientes de email

Coleção - Análises de email marketing em clientes de email Coleção - Análises de email marketing em clientes de email Thunderbird e Terra Nesta terceira edição da Coletânea de Análises de Email Marketing em Clientes de Email, apresentamos os estudos do webmail

Leia mais

SIMULADOS & TUTORIAIS

SIMULADOS & TUTORIAIS SIMULADOS & TUTORIAIS TUTORIAIS FLASH O Componente ColorPicker Copyright 2013 Todos os Direitos Reservados Jorge Eider F. da Silva Proibida a reprodução deste documento no todo ou em parte por quaisquer

Leia mais

Criação de um novo projeto no Eclipse utilizando Maven

Criação de um novo projeto no Eclipse utilizando Maven 1. Faça o download da versão mais atual do Eclipse IDE for Java EE Developers em https://www.eclipse.org/downloads/. 2. No Eclipse, crie um novo projeto Maven, em File >> New >> Maven Project 3. Marque

Leia mais

A versão Trial (30 dias), 32 ou 64-bit, Windows ou Linux, pode ser descarregada no seguinte link:

A versão Trial (30 dias), 32 ou 64-bit, Windows ou Linux, pode ser descarregada no seguinte link: BricsCAD V14 Parte 2 Documento Técnico 069 03 mar 2014 Introdução Continuamos a descrição das principais características do BricsCAD V14, e a sua comparação com o AutoCAD. O primeiro número e informações

Leia mais

CONHECIMENTOS ESPECÍFICOS

CONHECIMENTOS ESPECÍFICOS CONHECIMENTOS ESPECÍFICOS Acerca de segurança da informação, julgue os itens a seguir. 51 As organizações devem estabelecer controles de segurança da informação para proteger os direitos a propriedade

Leia mais

HTML5 HyperText Markup Language v5

HTML5 HyperText Markup Language v5 HTML5 HyperText Markup Language v5 Composição Web Engenharia InformáBca / InformáBca Web 2014/15 Artur M. Arsénio O Que há de novo no HTML5? A declaração DOCTYPE do HTML5 é muito simples:

Leia mais

Desenvolvimento com Android Studio Aula 01 Instalação e Configuração do Ambiente de Desenvolvimento, Estrutura de um projeto Android

Desenvolvimento com Android Studio Aula 01 Instalação e Configuração do Ambiente de Desenvolvimento, Estrutura de um projeto Android Desenvolvimento com Android Studio Aula 01 Instalação e Configuração do Ambiente de Desenvolvimento, Estrutura de um projeto Android Instalação e Configuração do Ambiente de Desenvolvimento Instalação

Leia mais

Scriptlets e Formulários

Scriptlets e Formulários 2 Scriptlets e Formulários Prof. Autor: Daniel Morais dos Reis e-tec Brasil Programação Avançada Para Web Página1 Meta Permitir ao aluno aprender a criar um novo projeto Java para web no Netbeans IDE,

Leia mais

MODULO 4 DESENVOLVIMENTO DE PÁGINAS WEB ESTÁTICAS. Redes de Comunicação

MODULO 4 DESENVOLVIMENTO DE PÁGINAS WEB ESTÁTICAS. Redes de Comunicação MODULO 4 DESENVOLVIMENTO DE PÁGINAS WEB ESTÁTICAS Redes de Comunicação Regras para um website eficaz Categorização dos conteúdos estrutura lógica dos conteúdos Condensação conteúdos simples e directos

Leia mais

Computação II Orientação a Objetos

Computação II Orientação a Objetos Computação II Orientação a Objetos Fabio Mascarenhas - 2014.1 http://www.dcc.ufrj.br/~fabiom/java Android Android é um sistema operacional para dispositivos móveis Kernel Linux, drivers e bibliotecas do

Leia mais

CRIAR UMA ANIMAÇÃO BÁSICA NO FLASH MX

CRIAR UMA ANIMAÇÃO BÁSICA NO FLASH MX CRIAR UMA ANIMAÇÃO BÁSICA NO FLASH MX Introdução Este tutorial vai-te ajudar a compreender os princípios básicos do Flash MX - tal como layers, tweens, cores, texto, linhas e formas. No final deste tutorial

Leia mais

Aula 9: Fundamentos do JQuery Fonte: Plano de Aula Oficial da Disciplina

Aula 9: Fundamentos do JQuery Fonte: Plano de Aula Oficial da Disciplina Programação para Internet Rica 1 Aula 9: Fundamentos do JQuery Fonte: Plano de Aula Oficial da Disciplina Objetivo: Capacitar o aluno para o trabalho com o framework JQuery. INTRODUÇÃO JQuery é uma biblioteca

Leia mais

Introdução à Tecnologia Web. Ferramentas e Tecnologias de Desenvolvimento Web. Profª MSc. Elizabete Munzlinger www.elizabete.com.

Introdução à Tecnologia Web. Ferramentas e Tecnologias de Desenvolvimento Web. Profª MSc. Elizabete Munzlinger www.elizabete.com. IntroduçãoàTecnologiaWeb FerramentaseTecnologiasde DesenvolvimentoWeb ProfªMSc.ElizabeteMunzlinger www.elizabete.com.br ProfªMSc.ElizabeteMunzlinger www.elizabete.com.br FerramentaseTecnologiasde DesenvolvimentoWeb

Leia mais

Computação II Orientação a Objetos

Computação II Orientação a Objetos Computação II Orientação a Objetos Fabio Mascarenhas - 2014.1 http://www.dcc.ufrj.br/~fabiom/java Introdução Esse não é um curso de Java! O objetivo é aprender os conceitos da programação orientada a objetos,

Leia mais

Formulários. Curso de PHP e MySQL EAD Moodle Desenvolvido e ministrado por William Hamilton dos Santos UTFPR

Formulários. Curso de PHP e MySQL EAD Moodle Desenvolvido e ministrado por William Hamilton dos Santos UTFPR Formulários Há várias maneiras de se criar um formulário na web, porém, é preciso considerar vários fatores para que este formulário não seja apenas uma página com um amontoado de campos, mas sim a porta

Leia mais

CSS é a abreviatura para Cascading Style Sheets Folhas de Estilo em Cascata

CSS é a abreviatura para Cascading Style Sheets Folhas de Estilo em Cascata CSS CSS é a abreviatura para Cascading Style Sheets Folhas de Estilo em Cascata CSS é uma linguagem para estilos (formatação) que define o layout de documentos HTML. CSS controla fontes, cores, margens,

Leia mais

animação smil Helder da Rocha (helder@argonavis.com.br)

animação smil Helder da Rocha (helder@argonavis.com.br) animação smil Helder da Rocha (helder@) Animação em SVG com SMIL Mais simples que scrip.ng, porém menos suporte nos browsers Chrome, Opera, FF 4 em diante), IE 9.0 (suporte parcial) Elementos e atributos

Leia mais

Tecnologias para apresentação de dados - HTML. Aécio Costa

Tecnologias para apresentação de dados - HTML. Aécio Costa Tecnologias para apresentação de dados - HTML Aécio Costa Apresentação de Dados na Web Tecnologias client-side HTML CSS JavaScript HyperText Markup Language Uma linguagem de marcação utilizada para produzir

Leia mais

Ferramenta para conversão de interfaces gráficas desenvolvidas em Delphi para a biblioteca GTK+ Acadêmico: Josimar Zimermann

Ferramenta para conversão de interfaces gráficas desenvolvidas em Delphi para a biblioteca GTK+ Acadêmico: Josimar Zimermann Ferramenta para conversão de interfaces gráficas desenvolvidas em Delphi para a biblioteca GTK+ Acadêmico: Josimar Zimermann Orientadora: Joyce Martins Roteiro Introdução Objetivos Fundamentação teórica

Leia mais

Estudo comparativo de diferentes linguagens de interfaces baseadas em XML

Estudo comparativo de diferentes linguagens de interfaces baseadas em XML Estudo comparativo de diferentes linguagens de interfaces baseadas em XML Ricardo Alexandre G. C. Martins, José Carlos Ramalho, and Pedro Rangel Henriques \{ram,jcr,prh\}@di.uminho.pt Departamento de Informática

Leia mais

X3DOM E WEBGL: O 3D INDEPENDENTE NA WEB

X3DOM E WEBGL: O 3D INDEPENDENTE NA WEB X3DOM E WEBGL: O 3D INDEPENDENTE NA WEB Augusto Francisco Ferbonink¹, Willian Barbosa Magalhães 1 Universidade Paranaense (UNIPAR) Paranavaí PR Brasil aferbonink@gmail.com wmagalhães@unipar.com Resumo.

Leia mais

DESENVOLVIMENTO WEB DENTRO DOS PARADIGMAS DO HTML5

DESENVOLVIMENTO WEB DENTRO DOS PARADIGMAS DO HTML5 DESENVOLVIMENTO WEB DENTRO DOS PARADIGMAS DO HTML5 Alex de Andrade Catini¹, Tiago Piperno Bonetti¹ ¹Universidade Paranaense (Unipar) Paranavaí PR Brasil Alex.catini@gmail.com, bonetti@unipar.br Resumo:

Leia mais

Imagens - Formatos. GIF (Graphics Interchange Format) JPEG (ou JPG) (Joint Pictures Experts Graphis)

Imagens - Formatos. GIF (Graphics Interchange Format) JPEG (ou JPG) (Joint Pictures Experts Graphis) Imagens - Formatos GIF (Graphics Interchange Format) - Muito popular na web. - Permite ter um máximo de 256 cores. - Indicado para cartoons, logos, imagens com áreas transparentes e animações. JPEG (ou

Leia mais

PROGRAMANDO ANDROID NA IDE ECLIPSE GABRIEL NUNES, JEAN CARVALHO TURMA TI7

PROGRAMANDO ANDROID NA IDE ECLIPSE GABRIEL NUNES, JEAN CARVALHO TURMA TI7 Serviço Nacional de Aprendizagem Comercial do Rio Grande do Sul Informação e Comunicação: Habilitação Técnica de Nível Médio Técnico em Informática Programação Android na IDE Eclipse PROGRAMANDO ANDROID

Leia mais

Desenvolvimento de Jogos 2D. Gutenberg Neto gutenberg@fuze.cc

Desenvolvimento de Jogos 2D. Gutenberg Neto gutenberg@fuze.cc Desenvolvimento de Jogos 2D Gutenberg Neto gutenberg@fuze.cc Inteligência Artificial Definição de comportamento de NPCs (personagens não-jogáveis) de forma a simular inteligência IA em jogos não necessariamente

Leia mais

User Guide Manual de Utilizador

User Guide Manual de Utilizador 2400 DPI OPTICAL GAMING MOUSE User Guide Manual de Utilizador 2014 1Life Simplify it All rights reserved. www.1-life.eu 2 2400 DPI OPTICAL GAMING MOUSE ENGLISH USER GUIDE...4 MANUAL DE UTILIZADOR PORTUGUÊS...18

Leia mais

CELLICA BANCO DE DADOS PARA IPAD GUIA DE USUÁRIO

CELLICA BANCO DE DADOS PARA IPAD GUIA DE USUÁRIO CELLICA BANCO DE DADOS PARA IPAD GUIA DE USUÁRIO Versão do produto: 4.7 Conteúdo 1 Introdução 6 1.1 Recursos 6 2 Usando o banco de dados Cellica no desktop 7 2.1 Profile Manager 7 2.1.1 Adicionar perfil

Leia mais

INTRODUÇÃO 12. DOCUMENTAÇÃO INTRODUÇÃO INTRODUÇÃO

INTRODUÇÃO 12. DOCUMENTAÇÃO INTRODUÇÃO INTRODUÇÃO INTRODUÇÃO 12. DOCUMENTAÇÃO Na plataforma Java SE 7, há cerca de 4000 classes e interfaces disponíveis para utilizarmos em nossas aplicações Podemos visualizar a documentação dessas classes e interfaces

Leia mais

Office 8K Mouse Ótico Sem Fio de 8 Botões

Office 8K Mouse Ótico Sem Fio de 8 Botões INTRODUÇÃO PARABÉNS PELA SUA COMPRA: O SEU NOVO RF MOUSE OFFICE 8K É FÁCIL DE INSTALAR E OFERECE INÚMEROS RECURSOS. O RÁDIO-RECEPTOR PODE SER ADEQUADAMENTE COLOCADO EM QUALQUER LUGAR PARA LHE PROPORCIONAR

Leia mais

Ruby. Conceitos básicos. Prof. Ms. Leonardo Botega. Diego Gabriel Pereira

Ruby. Conceitos básicos. Prof. Ms. Leonardo Botega. Diego Gabriel Pereira Ruby Conceitos básicos Prof. Ms. Leonardo Botega Diego Gabriel Pereira Quem somos nós Leonardo Botega Bacharel em Ciência da Computação UNIVEM Mestre em Ciência da Computação UFSCar Doutorando em Ciência

Leia mais