https://interfaces.ranoya.com

DESI

GN

FACES

INTER

D

I

AIS

D

I

G

T

E

I

I

I

I

I

I

I

I

I

I

I

I

I

I

I

I

I

I

I

I

I

AVISOS

ESTE MATERIAL FOI DESENVOLVIDO COMO PARTE INTEGRANTE DA DISCIPLINA DE DESIGN DE INTERFACES DIGITAIS DO CURSO DE BACHARELADO EM DESIGN DA UNIVERSIDADE FEDERAL DE PERNAMBUCO. SEU USO E ACESSO É PÚBLICO E IRRESTRITO, MAS NÃO CONFIGURA VÍNCULO COM A UNIVERSIDADE, TAMPOUCO O CUMPRIMENTO DAS EXIGÊNCIAS DA UNIVERSIDADE PARA CONCLUIR A DISCIPLINA DO CURSO, OU REALIZAR EQUIVALÊNCIA À QUALQUER OUTRA DISCIPLINA DE CURSO SUPERIOR OU DE QUALQUER OUTRA MODALIDADE. ESTE É APENAS UM MATERIAL DE APOIO AS ATIVIDADES DOCENTES E DISCENTES.

AS TECNOLOGIAS ENVOLVIDAS PARA A CONSTRUÇÃO DESTE MATERIAL NÃO SÃO INTEGRALMENTE COMPATÍVEIS COM DISPOSITIVOS MOBILE, EM ESPECIAL, AO SISTEMA OPERACIONAL IOS. POR MAIORES QUE SEJAM OS ESFORÇOS EM PRODUZIR UM MATERIAL QUE FUNCIONE BEM EM QUALQUER PLATAFORMA OU DISPOSITIVO, ALGUNS RECURSOS NECESSÁRIOS PARA A INTERAÇÃO PODEM NÃO ESTAR DISPONÍVEIS, OU SEREM INSUFICIENTES, NESTES DISPOSITIVOS.

OS CONTEÚDOS QUE FORAM CRIADOS E PRODUZIDOS PARA ESTA DISCIPLINA, E A CURADORIA DE REFERÊNCIAS E EXEMPLOS, SÃO PROPRIEDADE INTELECTUAL DO PROF. DR. GUILHERME RANOYA. SEU USO COMERCIAL OU REPRODUÇÃO (MESMO PARCIAL) POR ORGANIZAÇÕES COM FINS LUCRATIVOS SÃO VEDADOS, EXCETO NA EXPRESSA AUTORIZAÇÃO DO AUTOR.

DEPARTAMENTO DE DESIGN
dDESIGN | UFPE

UNIVERSIDADE FEDERAL DE PERNAMBUCO

COMUNICAÇÕES SÃO FEITAS ATRAVÉS DO AMBIENTE DA DISCIPLINA NO

GOOGLE CLASSROOM

CÓDIGO DA TURMA

xrjachn

ATENDIMENTOS INDIVIDUAIS PRESENCIAIS OU VIA GOOGLE MEETS PARA ACOMPANHAMENTO DE TRABALHOS, ESCLARECIMENTO DE DÚVIDAS, OU OUTRAS QUESTÕES, PRECISAM SER AGENDADOS NOS HORÁRIOS DISPONÍVEIS NA AGENDA DO PROFESSOR

SALA PARA VIDEOCONFERÊNCIAS

SALA PARA VIDEOCONFERÊNCIAS

A DISCIPLINA DE DESIGN DE INTERFACES FOI ELABORADA RESPEITANDO O CALENDÁRIO DE ATIVIDADES DO PROGRAMA DE EXTENSÃO EM INOVAÇÃO

A DISCIPLINA DE DESIGN DE INTERFACES FOI ELABORADA RESPEITANDO O CALENDÁRIO DE ATIVIDADES DO PROGRAMA DE EXTENSÃO EM INOVAÇÃO

ELA PODE TRABALHAR DE FORMA "CASADA" COM AS DISCIPLINAS DE PROJETÃO, OU DESIGN DE SERVIÇOS

programa de extensão em inovação

programa de extensão em inovação

PROJETO

DESIGN DE INTERFACES

EXTENSÃO: INOVAÇÃO

EXTENSÃO: EMPREENDEDORISMO

60 HORAS

60 HORAS

140 HORAS

80 HORAS

SEMESTRE 1

SEMESTRE 2

programa de extensão em inovação

PROJETÃO

DESIGN DE INTERFACES

EXTENSÃO: INOVAÇÃO

EXTENSÃO: EMPREENDEDORISMO

60 HORAS

60 HORAS

140 HORAS

80 HORAS

SEMESTRE 1

SEMESTRE 1

PROJETO

INTERFACES

EXTENSÃO

EXTENSÃO

SANDPIT

MIND THE BIZZ

SEMESTRE 4 E 5

PORTO DIGITAL

CENTELHA

SEMESTRE 3

SEMESTRE 2

programa de extensão em inovação

PROJETÃO

DESIGN DE INTERFACES

EXTENSÃO: INOVAÇÃO

EXTENSÃO: EMPREENDEDORISMO

60 HORAS

60 HORAS

140 HORAS

80 HORAS

SEMESTRE 1

SEMESTRE 1

PROJETO

INTERFACES

EXTENSÃO

EXTENSÃO

SANDPIT

MIND THE BIZZ

SEMESTRE 4 E 5

PORTO DIGITAL

CENTELHA

SEMESTRE 3

SEMESTRE 2

2 OU MAIS  DISCIPLINAS
1 PROJETO, 1 FOCO, 1 PREOCUPAÇÃO
+340H DA SUA CARGA HORÁRIA

2 PROGRAMAS DE QUALIFICAÇÃO EMPREENDEDORA
1 PROGRAMA DE INCUBAÇÃO DE NOVOS NEGÓCIOS

CONTINUIDADE

MENTORIAS
DEMODAY

QUESTIONAMENTOS

COMO RESOLVÊ-LOS

QUEST #1
QUEST #2
QUEST #3
QUEST #4

LEVANTAMENTOS

PERSONAS
JORNADAS
CARCTERIZAÇÃO
DO USUÁRIO

MVP

QUEST #5
QUEST #6
QUEST #7
QUEST #8
QUEST #9

ARQUITETURA
WIREFRAME
PROTÓTIPOS
USABILIDADE
TESTES
EXECUÇÃO

DESIGN DE INTERFACE

PROJETO (DESIGN)

DESIGN DE INTERFACE

+

SOCIEDADE

ESTÉTICA

TECNOLOGIA

CIÊNCIA

SOCIEDADE

ESTÉTICA

TECNOLOGIA

CIÊNCIA

CICLO / PROCESSO DE DESIGN

ESTRUTURA BASEADA NO TRABALHO DE GUSTAVO BOMFIM

Design é uma sistematização;
Design é um sistema.

PETER BEHRENS, 19212
Considerado o primeiro designer

IDEO Design Kit

IDEO Human Centered Design

Pensar em negócios quando fazemos design é equivalente a pensar na gravidade quando fazemos arquitetura

DIEGO RORIGUEZ
Intuit’s Chief Product & Design Office

DOUBLE DIAMOND (DESIGN COUNCIL)

DESCOBERTA

DEFINIÇÃO

DESENVOLVIMENTO

ENTREGA

PESQUISA

SÍNTESE

IDEAÇÃO

IMPLEMENTAÇÃO

PROJETAR CERTO A COISA

PROJETAR A COISA CERTA

PROJETAR A COISA CERTA

PROJETAR A COISA CERTA

PROJETAR A COISA CERTA

QUESTÕES

DESAFIOS

COMO FAZER

O QUE FAZER

COMO FAZER

O QUE FAZER

COMO FAZER

O QUE FAZER

COMO FAZER

O QUE FAZER

PROJETAR CERTO A COISA

PROJETAR CERTO A COISA

PROJETAR CERTO A COISA

ITERAÇÕES

DESIGN DE INTERFACE

DESIGN DE INTERAÇÃO

O QUE É, ONDE MEXE

COMO É, COMO FUNCIONA

LAYOUT

PRODUTO TÍPICO DA APPLE

IDENTIDADE VISUAL

DESIGN SYSTEMS

OBSERVAR
COMO UM
ANTROPÓLOGO

USER MAPPING

PENSAMENTO

VISÃO

MOTIVAÇÃO

CONTEXTO

COMPORTAMENTO

INTERFACE

AX

PROJETO COM BASE NO "AXISMO"

EXPERIENCE STORYBOARD

BOM PARA

VISÃO GERAL DO PROJETO

USO DO PROJETO AO LONGO DE UMA JORNADA

CONSTRUÇÃO NARRATIVA (PROPÓSITO E VALOR)

REPRESENTAÇÃO DE UM CASO DE USO CONTEXTUALIZADO DA SOLUÇÃO 

WIREFRAME

BOM PARA

DEFINIÇÃO DOS ELEMENTOS DA INTERFACE

DIMENSIONAMENTO DOS ELEMENTOS NA TELA/INTERFACE

ORGANIZAÇÃO ESPACIAL DO CAMPO/INTERFACE

USER FLOW

BOM PARA

MAPEAR A INTERAÇÃO ENTRE O USUÁRIO E O SERVIÇO

USABILIDADE E RESPONSIVIDADE PARA AS AÇÕES/INTERAÇÕES DO USUÁRIO

IDENTIFICAR OS PONTOS DE CONTATO ENTRE O USUÁRIO E O SISTEMA

JORNADA DE TELAS/INTERFACE PELAS QUAIS O USUÁRIO PASSA AO REALIZAR UMA TAREFA/ATIVIDADE NA SOLUÇÃO

DEPENDE DA CONSTRUÇÃO PRÉVIA DE WIREFRAMES E SERVICE BLUEPRINTS

SERVICE BLUEPRINT

BOM PARA

ENTENDER DEMANDAS DE INFORMAÇÃO AO LONGO DO SERVIÇO

ENTENDER HIERARQUIA DE DECISÕES E AÇÕES PARA FUNCIONAMENTO

ESQUEMA DETALHANDO O MECANISMO/ETAPAS DE FUNCIONAMENTO DA SOLUÇÃO (O QUE ACONTECE NOS BASTIDORES PARA ALIMENTAR O QUE O USUÁRIO VÊ E INTERAGE)

306 dp/dip/px

320 dp/dip/px

status bar 24dp/dip

app bar 56dp/dip

320 dp/dip/px

margem 7 dp/dip/px

margem 7 dp/dip/px

conteúdo 306 dp/dip/px

306 dp/dip/px

iPhone 4
iPhone 5
iPhone 6
Moto G
Samsung S8

320x480
320x568
375x667
360x640
360x740

2019 © PROF. DR. GUILHERME RANOYA