30:T630,descricaoobjetivos = html`

DD130 Design e Tecnologia X

Local:
Laboratório de Informática do CAC (LIEG)
Quintas-feiras das 14:00h às 18:00h

Ementa

A componente curricular tem o objetivo de proporcionar a compreensão de como funcionam os elementos produtivos primários da mídia computacional, isto é, o código computacional. Ela trabalha com a programação de scripts voltados para a construção técnica de documentos para a web.

Competências

Construção de websites.

Habilidades

Programação com códigos HTML, CSS e SVG.

`31:T4ff,descricaoavaliacao = md`

Avaliação

A avaliação da disciplina será realizada através de 5 exercícios de construção de layout, encaminhados pelo Google Classroom, com o valor de 2,0 pontos cada. Estes exercícios são a aplicação do código HTML+CSS e dos conhecimentos adquiridos ao longo das semanas de aula, para construção progressiva da estrutura base de um layout para web, conforme cronograma abaixo:

| Atividade | Peso | Data de Entrega | |-----------|------|-----------------| | [Exercício de Layout #1](https://webdesign.ranoya.com/exercicios/#layout1) | 2,0 | 30/06/2025 | | [Exercício de Layout #2](https://webdesign.ranoya.com/exercicios/#layout2) | 2,0 | 07/07/2025 | | [Exercício de Layout #3](https://webdesign.ranoya.com/exercicios/#layout3) | 2,0 | 14/07/2025 | | [Exercício de Layout #4](https://webdesign.ranoya.com/exercicios/#layout4) | 2,0 | 28/07/2025 | | [Exercício de Layout #5](https://webdesign.ranoya.com/exercicios/#layout5) | 2,0 | 11/08/2025 |

As atividades serão avaliadas pelos critérios:

1 Documentação clara e explicativa no código
2 Respeito aos prazos de entrega
3 Funcionamento adequado

`32:Taac,introfuturo = html`

Futuro do Design

Relação de links pertinentes, compilados através do projeto Futuro do Design, com conteúdos relacionados à disciplina e organizados de forma estruturada por tópicos e relações com ela. Você pode filtrar as informações apresentadas para localizar algo específico no conjunto.

`33:[] 2e:{"title":"Ementa: Introdução aos materiais da mídia computacional","cells":[{"id":0,"value":"# Ementa: Introdução aos materiais da mídia computacional","pinned":false,"hidden":false,"mode":"md"},{"id":102,"value":"titulo = html`Introdução aos materiais da mídia computacional`","pinned":false,"hidden":false,"mode":"ojs"},{"id":594,"value":"$30","pinned":false,"hidden":false,"mode":"ojs"},{"id":681,"value":"descricaometodo = md`\n### Metodologia\n\nWorkshops de experimentação com programação colocando em prático aquilo que se encontra explicado no material interativo, nas aulas expositivas e no livro interativo, aplicando o raciocínio envolvido na programação e na construção de código.\n\nReforço das explicações e demonstrações através de atividades práticas, simples e constantes, para desenvolver os hábitos e traquejos com programação.\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":684,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":689,"value":"listaaulas_publico = html`${bloco_disciplinas_publico(\n listadisciplinas,\n textos,\n pessoas,\n materiais,\n posts\n)}`","pinned":false,"hidden":false,"mode":"ojs"},{"id":691,"value":"listaaulas = html`

${bloco_disciplinas(\n listadisciplinas,\n textos,\n pessoas,\n materiais,\n posts\n)}

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":693,"value":"bibliografia = html`

Bibliografia

\n${bibliografiapublica(bibliojson, \"\", true)}`","pinned":false,"hidden":false,"mode":"ojs"},{"id":695,"value":"bibliografiaopen = html`

Bibliografia

\n${bibliografiaEmentas(bibliojson, \"\", true)}

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":796,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":766,"value":"viewof filtros = Inputs.text({\n placeholder: \"Ex: p5, referências, história\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":790,"value":"futuro = html`\n${gerapoe(omni)}`","pinned":true,"hidden":false,"mode":"ojs"},{"id":187,"value":"

\n\n----","pinned":false,"hidden":false,"mode":"md"},{"id":746,"value":"originaljson = gsdata(\n \"https://docs.google.com/spreadsheets/d/1Hja-7ozKTpcfhVX9sc3FkDH-NLj_RXllFIDTO8EIFV0/edit?gid=1933151867#gid=1933151867\"\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":168,"value":"import {\n producaocompleta,\n geracvisse,\n prod_semaulas,\n montadisciplinas,\n montaequipe,\n montaequipegrande,\n montaacao,\n listapessoas,\n stijl\n} from \"@ranoya/vissev2-producaocompleta\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":716,"value":"import {\n bloco_disciplinas,\n bloco_disciplinas_publico,\n textos,\n pessoas,\n materiais,\n posts,\n adapta\n} from \"@ranoya/visse-ensino\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":183,"value":"import {\n alphabetic,\n gsdata,\n imagefromallsources,\n selecte,\n cfilter,\n tags\n} from \"@ranoya/datat\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":713,"value":"import {\n bibliografiaEmentas,\n bibliografiapublica\n} from \"@ranoya/bibliotecacompleta\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":706,"value":"textosvisse = gsdata(\n \"https://docs.google.com/spreadsheets/d/1qXCwwsiNdZnqlvNzLxol-ZGRTEH7fQfRsK2SWpNIuM4/edit?gid=1960324476#gid=1960324476\"\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":771,"value":"omniddocs = gsdata(\n \"https://docs.google.com/spreadsheets/d/17ybrU9i4Z_czj_-5n1gWUBvgicHfwJUyMBqriuA-Ab8/edit?gid=743128170#gid=743128170\"\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":768,"value":"viewof omni = Inputs.search(omniddocs, {\n label: \"omni\",\n placeholder: \"Nenhum filtro\",\n query: \"aula-web \" + filtros,\n disabled: true\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":704,"value":"viewof bibliojson = Inputs.search(textosvisse, {\n label: \"bibliojson\",\n placeholder: \"Nenhum filtro\",\n query: \"webdesign_aula\",\n disabled: true\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":702,"value":"viewof listadisciplinas = Inputs.search(originaljson, {\n label: \"listadisciplinas\",\n placeholder: \"Nenhum filtro\",\n query: \"aula-web\",\n disabled: true\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":778,"value":"gerapoe = function (arr) {\n let grupos = tags(arr, \"Group\", \",\");\n\n let dogrupos = \"\";\n\n let code = `

`;\n\n for (let g = 0; g < grupos.length; g++) {\n code += `

${grupos[g]}

`;\n\n dogrupos = cfilter(arr, \"Group\", new RegExp(grupos[g], \"gm\"));\n\n for (let i = 0; i < dogrupos.length; i++) {\n code += `${dogrupos[i].Name}`;\n }\n }\n\n code += \"

\";\n\n return code;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":442,"value":"setemmostraO = function (arr, frase) {\n let code = ``;\n\n if (arr.length > 0) {\n code = `

${frase}

\n ${montaequipe(arr)}\n

`;\n }\n\n return code;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":417,"value":"setemmostra = function (arr, frase) {\n let code = ``;\n\n if (arr.length > 0) {\n code = `

${frase}

\n ${montaequipegrande(arr)}\n

`;\n }\n\n return code;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":454,"value":"function set(input, value) {\n input.value = value;\n input.dispatchEvent(new Event(\"input\", { bubbles: true }));\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":504,"value":"estaile = ``","pinned":false,"hidden":false,"mode":"ojs"},{"id":265,"value":"estilos = html`\n${stijl}\n${estaile}\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":719,"value":"","pinned":false,"hidden":false,"mode":"html"},{"id":159,"value":"### Dependências e conexões\n\n----\n\n\nAlimenta página de Ementas V2 - Introdução aos materiais da mídia computacional\n\nUtiliza dados e recursos do Geradores de timelines de produção para o VISSE\nUtiliza dados das bases bibliográficas do VISSE (@ranoya/bibliotecacompleta)\nUtiliza recursos da estrutura original de ementas (@ranoya/visse-ensino)","pinned":false,"hidden":false,"mode":"md"}],"files":"$W33","stdlib":"1","titling":"auto"}