WEBDESIGN | UFPE 



1 Professor 

Prof. Dr. Guilherme Ranoya, monitor: Deyvison Moraes

2 Oferta e formato 

Prevista para  


Última atividade realizada:


Próxima aula / atividade:



3 Resumo 

Esta disciplina tem a função de ensinar sobre os materiais e processos envolvidos na construção de websites. Ela trabalhará com os aspectos e conceitos técnicos de infra-estrutura, transporte de dados pela internet, princípios de programação, princípios de produção e construção de código HTML/CSS.


Todos estes assuntos serão abordados de forma introdutória. A disciplina não tem a missão de formar programadores ou desenvolvedores web, e mesmo dentro do escopo de design, são necessários bem mais do que 6 meses de aulas para que um profissional seja plenamente capaz de assumir projetos voltados para web, considerando que as tecnologias e as técnicas mudam constante e rapidamente.


O intuito deste grupo de estudo é envolver gradualmente o aluno no mundo do design para web, e habilitá-lo para que possa utilizar esta mídia para o desenvolvimento de seus trabalhos em outras disciplinas, e projetos pessoais.

4 O que você efetivamente aprenderá na disciplina? 


Habilidades

1 Programação com código HTML


2Programação com código CSS

Competências

1 Construção de websites



5 Recursos e materiais necessários 

Para cursar a disciplina será necessário um computador e conexão com a internet. Por se tratar de uma disciplina que envolve programação, tablets ou celulares não são recomendados para o desenvolvimento das atividades propostas.

6 Recomendações e encaminhamento 

Recomenda-se aos alunos que se interessarem na área de design para mídias digitais que cursem, após a cadeira de Webdesign, as demais disciplinas como apresentadas no diagrama abaixo. Esta trajetória não se configura como algo obrigatório ou necessário, mas uma recomendação para que o aproveitamento formativo seja integral.

7 Quem deve cursar esta disciplina?

Alunos de graduação que desejam iniciar seu aprendizado sobre programação
Alunos de graduação que desejam entender como é o processo de construção daquilo que vemos e usamos nos navegadores web

8 Quem NÃO deve cursar esta disciplina?

Alunos que já tenham conhecimento ou prática com o assunto, uma vez que o conteúdo abordado pelo grupo de estudo é introdutório;
Alunos interessados em design de interfaces, arquitetura de informação, experiência de uso, e outros assuntos relacionados com a web, mas que cabem ao eixo de estética, não o de tecnologia.

9 Ementa 

Eixo de tecnologia
nível fundamental


Estudo dos processos e materiais utilizados para construção de artefatos de informação em suporte digital, mais especificamente, cujo suporte são os navegadores web, contemplando os aspectos técnicos da mídia computacional, das convenções e peculiaridades da linguagem, e dos conceitos envolvidos para a viabilidade de sua produção.

10 Objetivos 

A proposta deste componente curricular é preparar o aluno para as atividades, as práticas e o raciocínio envolvidos na construção de um formato específico das mídias digitais, o website. Apesar de comum, este tipo de projeto exige detalhismo técnico e envolve conhecimento de particularidades sobre os materiais empregados (a confecção de códigos do tipo script), as tecnologias e a organização produtiva. Neste escopo, o presente grupo de estudo visa desenvolver a competência construtiva dentro do contexto digital (ainda que em um espectro reduzido das inúmeras formas e formatos desta mídia), com o intuito de habilitar o estudante a utilizá-la em seus próprios projetos, ou trabalhar com ela de forma consciente sobre o que é possível e o que é viável nela, e/ou como as soluções que elabora podem ser executadas nela.

11 Metodologia 

Aulas expositivas para apresentação e discussão de conceitos e questões envolvidas na infra-estrutura tecnologica da mídia digital, e aulas práticas para experimentação e entendimento dos elementos construtivos do artefato website.

12 Conteúdo Programático 


1 Arquitetura da mídia e fundamentos


O que é o código computacional
Características do material construtivo (código computacional)
Tecnologia e infra-estrutura
Processos de contrução e manufatura
Limites técnicos da mídia computacional
Etapas do processo de criação de um website
O sistema de arquivos e referênia
Universal resource locator (URL)

2 Hypertext Markup Language | HTML


Sintaxe do código HTML
Estrutura/organização básica do código HTML
Cabeçalho e definições do documento HTML
Elementos de conteudo/inline
Elementos de bloco
Formulários


3 Cascade Style Sheets | CSS


Aplicação style, tag, class e id
Sintaxe e filtros de aplicação de CSS
Cores
Dimensionamento, dimensões e elementos do dimensionamento (box model)
Posicionamento
Background
Tipografia e fontes
Detalhes
Transições

4 Design Responsivo


Spearação de código
Variáveis de CSS
Mobile First
Breakpoints
Media Query
Grid


Documentação de aula

Plano de aula


13 Sistema de avaliação e critérios 

Entrega de um trabalho final (website), produzido como um site pessoal ou contendo um trabalho/projeto para outra disciplina.




Critérios de avaliação

1 Documentação clara e explicativa no código


2Funcionamento adequado




14 Bibliografia 

15 Resultados e contribuições 

Esta disciplina contribui ao contexto social em que estamos inseridos preparando profissionais de design para que pensem, projetem, produzam e aperfeiçõem websites, mídia cuja ênfase são as informações públicas sobre empresas, negócios, produtos, serviços dentre uma grande variedade de outras atividades para as quais a web serve como suporte informacional.


Ela também contribui com o processo formativo do designer, em conjunto às demais disciplinas oferecidas no curso de Bacharelado em Design da Universidade Federal de Pernambuco, introduzindo o aluno aos artefatos digitais e ao design construído através do código computacional, objetivo do projeto Futuro do Design em que esta disciplina está inserida. Nela, se inicia o desenvolvimento da competência de se projetar para mídias complexas, como pode ser obervado nos trabalhos desenvolvidos na disciplina:

 

16 O que está em desenvolvimento 

 

17 Histórico, diagnósticos e aperfeiçoamento 

 
COPYRIGHT © 2019
PROF. DR. GUILHERME RANOYA, dDESIGN | UFPE
2020.1