Upgrade to Pro — share decks privately, control downloads, hide ads and more …

A arte Jedi de criar temas para o moodle

A arte Jedi de criar temas para o moodle

Chega de falar que o Moodle é o chewie dos LMSs. Nesta apresentação seremos iniciados nos caminhos da força, partindo de Dagobah até a jornada final. Colocaremos fim as alterações no core para mudanças de interface! É o fim do império dos temas congelados, cheio de colunas e sem cores! "Tente não. Faça, ou não faça. Tentativa não há." - Yoda

Willian Mano

October 04, 2016
Tweet

More Decks by Willian Mano

Other Decks in Programming

Transcript

  1. “MANO” WILLIAN

    View full-size slide

  2. quem sou eu
    • Analista de sistemas - FACAM
    • Graduando em engenharia da computação - UEMA
    • Supervisor de desenvolvimento UemaNet/UEMA
    • Vida útil na web: 7 anos

    View full-size slide

  3. roteiro
    Criação de
    tema:
    Ferramentas
    A evolução
    dos temas
    GRUNT
    configuração
    do tema
    Estrutura de
    arquivo de
    tema
    Cuidado
    com o ladro
    negro da
    força
    reescrita de
    renderers
    The galaxy
    ahead

    View full-size slide

  4. no início
    tudo era trevas

    View full-size slide

  5. Então yoda…
    fez um curso de webdesign

    View full-size slide

  6. E depois…
    Contratou um designer

    View full-size slide

  7. http://www.cursosabertos.uema.br

    View full-size slide

  8. Criação de tema: Ferramentas
    PAPEL E
    LÁPIS
    BALSAMIQ
    MOCKUP

    View full-size slide

  9. balsamic mockup

    View full-size slide

  10. grunt
    The JavaScript Task Runner
    • Automatiza tarefas
    • Minificar e “juntar” css
    • Minificar javascript
    • Executar tasks
    • Limpar cache

    View full-size slide

  11. grunt é nosso R2-d2

    View full-size slide

  12. exemplo do Arquivo gulp

    View full-size slide

  13. configuração do tema

    View full-size slide

  14. configuração do tema

    View full-size slide

  15. Estrutura de arquivo de tema

    View full-size slide

  16. Estrutura de arquivo de tema

    View full-size slide

  17. Estrutura de diretórios do tema

    View full-size slide

  18. Cuidado com o lado
    negro da força

    View full-size slide

  19. não altere o código
    nativo do moodle
    lord vader vai cortar tua mão a noite

    View full-size slide

  20. Alteração do código do moodle
    • Pode gerar mal funcionamento do moodle
    • Difícil manutenção
    • Pode gerar problema ao tentar localizar no futuro
    • Problema para atualizar versões do moodle
    Eu tô
    de olho

    View full-size slide

  21. reescrita de
    renderers
    a parte jedi dessa conversa

    View full-size slide

  22. luke eu sou seu pai!
    orientação a objetos

    View full-size slide

  23. Kraus eu sou seu pai!

    View full-size slide

  24. reescrita de renderers

    View full-size slide

  25. reescrita de renderers

    View full-size slide

  26. 1-declarar reescrita de renderer

    View full-size slide

  27. 2-criar arquivo renderers

    View full-size slide

  28. sobreescrever renderer

    View full-size slide

  29. The galaxy ahead

    View full-size slide

  30. Novidades que estão por vir
    • CSS Framework

    Mover do bootstrap 2 para o 4
    • Testing framework

    Tornar independente do tema. Desenvolvedores
    podem fazer testes sem o tema atual afetá-los.
    • Navigation

    Tornar mais intuitivo, melhorando os caminhos e o
    fluxo de trabalho.
    • A distinct visual design

    Atualizar design para padrões modernos de design
    https://docs.moodle.org/dev/Theme_And_Navigation_Project_3.2

    View full-size slide

  31. obrigado
    que a força esteja com vocês!

    View full-size slide