• Produção Cultural e Design


    Design de Interface

    • Plano de Estudos

      Seja bem-vindo(a) ao AVEA de Design de interface do Eixo Tecnológico Produção Cultural e Design. Neste AVEA, você encontrará material para estudo dos elementos da linguagem visual em composição de interfaces. A partir dos conceitos de interação e informação, usabilidade e ergonomia serão estudados métodos para análise, avaliação e desenvolvimento de interfaces. 

      Para iniciar, leia o Plano de Estudos e saiba o que poderá encontrar por aqui.

      • PLANO DE ESTUDOS
      • Estudos Conteúdos e Atividades Carga Horária

        Estudo 1:

        Design de interface
        • Citação sobre interface.
        • Videoaula sobre os aspectos importantes no design de interfaces.
        • Apresentação sobre os aspectos historicos do design da interface.
        • Atividade Avaliativa
        		 8h

        Estudo 2:

        Design de Interação
        • Breve explicação do projeto.
        • Videoaula sobre Design de interação
        • Material complementar sobre os 6 Princípios Fundamentais
        		 8h

        Estudo 3:

        Usabilidade e Experiência do Usuário
        • Videoaula sobre princípios e recomendações de usabilidade .
        • Texto didático principios de Nielsen
        • Atividade Avaliativa
        • Materiais complementares sobre testes de usabilidade
        		 8h

        Estudo 4:

        Linguagem visual no Design de Interfaces
        • Videoaula sobre elementos da comunicação visual.
        • Atividade Avaliativa.
        • Materais complementares: para inspiração a execução do projeto.
        		 8h

        Estudo 5:

        Prototipagem
        • Videoaula sobre um editor gráfico.
        • 2 Atividade Avaliativa.
        • Materiais complementares com recomendações para o design de interfaces.
        		 8h

    • Encontros Síncronos

      • Presença

        • Dúvidas

        • Design de Interface

          Carga Horária
          8 horas

          Nesta unidade curricular você vai estudar como analisar, avaliar e desenvolver interfaces. Vamos começar estudando os conceitos de design de interface, interação e informação. Você vai perceber que o Design de interface engloba o Design de interação e o Design visual. Vamos estudar também um breve histórico do design de interfaces e os aspectos que ganharam importância para o desenvolvimento dos projetos atuais.

          Bom estudo!

          •  [...] as interfaces ruins, que dificultam ou mesmo impedem o uso do sistema, não só aborrecem os usuários como são motivos de frustração e perda de auto-estima. Algumas pessoas se culpam e se sentem diminuídas por não saberem usar um programa de software. Elas generalizam a impressão de que todos os indivíduos inteligentes e atualizados o fazem facilmente. No caso de sistemas de uso frequente e profissional, os aborrecimentos e frustrações podem levar à ansiedade e ao estresse em decorrência da perda de produtividade e da obrigação de utilizar um sistema imposto pela chefia. Em casos mais agudos, o estresse não liberado pode levar a psicopatologias, em um processo pelo qual as pessoas se apresentam progressivamente irritadas, deprimidas, negativas, apáticas, sentem-se perseguidas ou se tornam rudes com os colegas. Mais tarde somatizam e passam a apresentar dores de cabeça, tendinites, palpitações, cólicas. Em casos extremos, podem desenvolver ansiedade generalizada, comportamento compulsivo, crise de pânico. Não se pode tirar a responsabilidade de uma interface humano-computador ruim pela loucura no trabalho informatizado (CYBIS; BETIOL E FAUST, 2010, p.15).

             

          • Sabendo da responsabilidade dos projetistas de interfaces, a partir de agora, vamos observar com mais atenção as interfaces usadas no dia a dia e tentar identificar as possibilidades de melhorias. Considere que mesmo um detalhe sutil pode fazer muita diferença. 

          •  Videoaula

            Para conhecer mais sobre os aspectos que são importantes no design de interfaces, e como foram mudando ao longo do tempo, assista a videoaula e leia o material indicado.

          •  Atividade

            Participe do fórum sobre as interfaces que nos atrapalham a vida. E se observarmos bem, são muitas. Identificar esses problemas é o primeiro passo para criarmos  soluções originais e eficientes.

          •  Materiais complementares

            Veja alguns links interessantes sobre o tema:

        • Design de Interação

          Carga Horária
          08 horas

          Vamos procurar entender melhor a forma como as pessoas, com suas diferentes características, lidam com as interfaces. O design de interação precisa considerar tanto os aspectos objetivos como também subjetivos e qualitativos, visando soluções funcionais, desejáveis e acessíveis. Você também vai conhecer métodos para projetos de interfaces levando em consideração os diferentes usuários.

          • Ao longo desta Unidade curricular vamos desenvolver um projeto de redesign de aplicativo a partir do diagnóstico de alguns problemas de usabilidade, problemas relacionados ao foco/público alvo ou inadequações conceituais e estéticas.

            O projeto pode ser feito individualmente ou em duplas e será desenvolvido em 4 etapas:

            Fase 1: Seleção de um app e identificação dos problemas

            Fase 2: Avaliação da usabilidade/arquitetura da informação

            Fase 3: Proposta de redesign

            Fase 4: Prototipagem e testes

            Bom estudo!

          •  Videoaula

            Para começar, assista a videoaula Design de interação. Conhecendo os desafios de um projeto de interfaces, você será capaz de selecionar um aplicativo que precise de um redesign, identificar os objetivos do trabalho e planejar mais detalhadamente as etapas do seu projeto.

          •  Atividade

            Vamos começar a Fase1 do projeto de redesign com a seleção de um App e identificação dos problemas. Bom trabalho! 

          •  Materiais complementares

            Veja alguns links interessantes sobre o tema:

        • Usabilidade e Experiência do Usuário

          Carga Horária
          08 horas

          O objetivo desta etapa é entender os conceitos de usabilidade e de experiência do usuário (UX) e observar as diferenças entre essas duas abordagens. A usabilidade é um conceito mais antigo, consolidado e pragmático, já a UX vem sendo utilizada atualmente, com foco global no usuário, na sua satisfação e interatividade. 

        • Linguagem visual no Design de Interfaces

          Carga Horária
          8 horas

          Neste tópico vamos estudar o design visual de interfaces, ou seja, a última camada do projeto de produto digital. Aqui vocês vão colocar em prática os conhecimentos adquiridos em Fundamentos do design, sobre os elementos e técnicas de comunicação visual e sobre hierarquia visual. Isso é muito importante, pois não se trata apenas do resultado estético de um app ou site, mas do contato com o usuário e suas possibilidades de interação.

        • Prototipagem

          Carga Horária
          8 horas

          Nesta etapa vamos explorar um software para prototipagem do seu projeto de interface, o Figma.  Com isso, é possível avaliar a  usabilidade e analisar a experiência dos usuários para fazer os ajustes necessários antes da implementação do sistema.

          Bom estudo!

          • O Figma é um editor gráfico para prototipagem de projetos de design para a web. Com o Figma é possível que a equipe trabalhe em conjunto, num projeto colaborativo. O desenvolvimento de um protótipo é fundamental para os testes com os usuários, é muito útil para o entendimento da estrutura de navegação e para que os clientes possam entender o projeto. Um protótipo realizado diretamente no navegador permite que as alterações sejam vistas em tempo real pela equipe e facilita muito o trabalho da equipe.

          •  TUTORIAL

            Veja um tutorial sobre o Figma.

          •  Atividade

            Desenvolva o protótipo do App, mostrando o redesign das páginas.

          •  Materiais complementares

            O Google material.io oferece várias recomendações para o design de interfaces e conjuntos de ícones gratuitos para uso nos seus projetos.

        • Videoaulas e Materiais

        • Atividades

          • Estudo 1: Design de interface

            Participe do fórum sobre as interfaces que nos atrapalham a vida. E se observarmos bem, são muitas. Identificar esses problemas é o primeiro passo para criarmos  soluções originais e eficientes.

            Estudo 2: Design de interação

            Vamos começar a Fase1 do projeto de redesign com a seleção de um App e identificação dos problemas. Bom trabalho! 

            Estudo 3: Usabilidade e Experiência do Usuário

            Vamos aprofundar a análise do app que você selecionou. Faça a avaliação do aplicativo utilizando um Checklist. Você pode escolher o MATcH (Checklist para Avaliação da Usabilidade de Aplicativos para Celulares Touchscreen) ou o Clínica de design.

            Estudo 4: Linguagem visual

            Nesta Fase 2 do projeto, faça o desenho do esqueleto do App, levantando o que precisa ser modificado. Apresente sua proposta de alteração.

            Estudo 5: Prototipagem

            Desenvolva o protótipo do App, mostrando o redesign das páginas.

        • Equipe

          • Professores conteudistas
            Laíse Miolo de Moraes

            Designers educacionais
            Verônica Ribas Cúrcio
            Daniela Estaregue Alves

            Revisores
            Denise de Mesquita Correa
            Caroline Reis Vieira Santos

            Coordenador do Programa no Câmpus Palhoça
            Saulo Zulmar Vieira

            Coordenadores do Eixo Tecnológico Produção Cultural e Design
            Renata da Silva Krusser

            Coordenadora Geral PQ-ANP
            Maria da Glória Silva e Silva