1
Creative Brief
- Project Overview
O projeto eLearning Templates começou como uma forma de simplificar meu próprio processo de desenvolvimento, mas rapidamente evoluiu para um kit de ferramentas usado em vários contratos com clientes. Abrangendo oito anos e refinados em três meses intensivos, esses nove modelos de Storyline foram criados para eliminar o trabalho de produção redundante e, ao mesmo tempo, elevar a qualidade do design.
- Goals
Crie um sistema de modelos de nível profissional, pronto para HTML5, que permita a criação rápida e escalável de conteúdo para designers instrucionais, mantendo a acessibilidade, a flexibilidade e um padrão de design visual limpo.
- Challenges
- Garantindo o desempenho entre dispositivos e HTML5 em diferentes pilhas de tecnologia do cliente
- Incorporando acessibilidade e lógica de interação sem aumentar a complexidade dos slides
- Projetando para a adaptabilidade em todos os setores, sistemas de marca e formatos de aprendizagem
- Equilibrando a simplicidade para usuários não técnicos com profundidade suficiente para usuários avançados
- Timeline2017—2025
- Team Size
1 membro
- Roles
1 membro
- Tools
Adobe Photoshop, Illustrator, Cinema 4D, Render Engine, Adobe Audition, Articulate Storyline 360, Audacity, PowerPoint
- Outcome
Os modelos foram criados para apoiar metas comuns de aprendizado, como:
- Recuperação de conhecimento
- Compreensão do conceito
- Treinamento processual
- Tomada de decisão baseada em cenários
- Validação de competência por meio de questionários e camadas de feedback
Cada layout e interação foram projetados para garantir o alinhamento com objetivos de aprendizagem bem definidos em toda a Taxonomia de Bloom, desde lembrar e entender até aplicar e avaliar.

2
Live Product Simulation
3
Motion Principles
Esses modelos refletem os princípios da teoria da carga cognitiva, do aprendizado multimídia e da prática de recuperação. Ao remover elementos de design estranhos e focar em hierarquias visuais claras, eles ajudam a reduzir o esforço mental e melhorar a retenção. Os modelos suportam a lógica de avaliação formativa e sumativa, permitindo uma medição eficaz dos resultados da aprendizagem.
Primary

Seconary

Tertiary

Key Motion Components
- Primary Motion
Esses modelos se tornaram um ativo fundamental em meu kit de ferramentas de design instrucional, usado para acelerar a entrega do projeto, manter a consistência e escalar a produção de acordo com as diversas necessidades e cronogramas do cliente.
- Secondary Motion
- 9 modelos versáteis e testados pelo cliente
- Usado em vários setores e tipos de cursos
- Reduza o tempo de desenvolvimento em 50 a 60%
- Acessível, visualmente aprimorado e pronto para implantação em grande escala
- Tertiary Motion
- Construir uma vez e reutilizar com propósito é como você dimensiona o design instrucional
- A acessibilidade e a flexibilidade devem ser incorporadas à base, não adaptadas
- Um sistema bem elaborado se torna um facilitador criativo, não uma restrição
- Rationale
Cada modelo foi criado com as melhores práticas alinhadas às WCAG, incluindo ordem de foco adequada, navegação pelo teclado e compatibilidade com leitores de tela. O contraste de cores foi cuidadosamente considerado, e a dependência mínima de sinais visuais garante que o conteúdo seja acessível a uma ampla variedade de alunos. Os modelos são projetados para serem inclusivos por padrão, exigindo ajustes mínimos para atender à maioria dos padrões de acessibilidade da empresa.
Easing Curves & Durations

navigational transitions
Custom Animated components

Infographics

4
Engineering Implentation
Approach
Prototype Setup
.jpg)





1
Build Overview
2
Creative Rationale
Goal
Crie um sistema de modelos de nível profissional, pronto para HTML5, que permita a criação rápida e escalável de conteúdo para designers instrucionais, mantendo a acessibilidade, a flexibilidade e um padrão de design visual limpo.
Process
- Descoberta: Identificou as necessidades comuns dos clientes em todos os projetos para definir o escopo do modelo
- Design e desenvolvimento: Criou nove modelos distintos (questionários, iniciantes, bibliotecas, interações) em várias proporções e estilos visuais
- Teste e controle de qualidade: Realizou testes extensivos de compatibilidade, acessibilidade e experiência do usuário do navegador
- Iteração: Modelos refinados com base no feedback real dos clientes e nos padrões em evolução
Key Highlights
Detailed Insights
Deep Dives
Learning Science
Esses modelos refletem os princípios da teoria da carga cognitiva, do aprendizado multimídia e da prática de recuperação. Ao remover elementos de design estranhos e focar em hierarquias visuais claras, eles ajudam a reduzir o esforço mental e melhorar a retenção. Os modelos suportam a lógica de avaliação formativa e sumativa, permitindo uma medição eficaz dos resultados da aprendizagem.
2
Creative Rationale
Goal
Challenges
Process
Impact and Results
Measurable Outcomes
Takeaways
1
The brief
Goal
Crie um sistema de modelos de nível profissional, pronto para HTML5, que permita a criação rápida e escalável de conteúdo para designers instrucionais, mantendo a acessibilidade, a flexibilidade e um padrão de design visual limpo.
Challenges
- Garantindo o desempenho entre dispositivos e HTML5 em diferentes pilhas de tecnologia do cliente
- Incorporando acessibilidade e lógica de interação sem aumentar a complexidade dos slides
- Projetando para a adaptabilidade em todos os setores, sistemas de marca e formatos de aprendizagem
- Equilibrando a simplicidade para usuários não técnicos com profundidade suficiente para usuários avançados
Learning Objectives
Os modelos foram criados para apoiar metas comuns de aprendizado, como:
- Recuperação de conhecimento
- Compreensão do conceito
- Treinamento processual
- Tomada de decisão baseada em cenários
- Validação de competência por meio de questionários e camadas de feedback
Cada layout e interação foram projetados para garantir o alinhamento com objetivos de aprendizagem bem definidos em toda a Taxonomia de Bloom, desde lembrar e entender até aplicar e avaliar.
Learning Science
Esses modelos refletem os princípios da teoria da carga cognitiva, do aprendizado multimídia e da prática de recuperação. Ao remover elementos de design estranhos e focar em hierarquias visuais claras, eles ajudam a reduzir o esforço mental e melhorar a retenção. Os modelos suportam a lógica de avaliação formativa e sumativa, permitindo uma medição eficaz dos resultados da aprendizagem.
Learning Methodolgy
Os modelos são baseados em um design modular baseado em cenários, permitindo o aprendizado na hora certa, a repetição espaçada e a progressão orientada por avaliações. Eles oferecem suporte a caminhos de aprendizado lineares e não lineares, tornando-os ideais para estruturas de aprendizado adaptáveis e ambientes mistos. As interações são criadas para se alinharem à tomada de decisões e às verificações de conhecimento do mundo real.
Process
- Descoberta: Identificou as necessidades comuns dos clientes em todos os projetos para definir o escopo do modelo
- Design e desenvolvimento: Criou nove modelos distintos (questionários, iniciantes, bibliotecas, interações) em várias proporções e estilos visuais
- Teste e controle de qualidade: Realizou testes extensivos de compatibilidade, acessibilidade e experiência do usuário do navegador
- Iteração: Modelos refinados com base no feedback real dos clientes e nos padrões em evolução
Impact and Results
Esses modelos se tornaram um ativo fundamental em meu kit de ferramentas de design instrucional, usado para acelerar a entrega do projeto, manter a consistência e escalar a produção de acordo com as diversas necessidades e cronogramas do cliente.
Measurable Outcomes
- 9 modelos versáteis e testados pelo cliente
- Usado em vários setores e tipos de cursos
- Reduza o tempo de desenvolvimento em 50 a 60%
- Acessível, visualmente aprimorado e pronto para implantação em grande escala
Takeaways
- Construir uma vez e reutilizar com propósito é como você dimensiona o design instrucional
- A acessibilidade e a flexibilidade devem ser incorporadas à base, não adaptadas
- Um sistema bem elaborado se torna um facilitador criativo, não uma restrição
Accessibility & inclusion
Cada modelo foi criado com as melhores práticas alinhadas às WCAG, incluindo ordem de foco adequada, navegação pelo teclado e compatibilidade com leitores de tela. O contraste de cores foi cuidadosamente considerado, e a dependência mínima de sinais visuais garante que o conteúdo seja acessível a uma ampla variedade de alunos. Os modelos são projetados para serem inclusivos por padrão, exigindo ajustes mínimos para atender à maioria dos padrões de acessibilidade da empresa.
3
Results
ELearning Templates



