D
DLDamian
Épsilon
Olá pessoal, trago um tutorial básico para que possam criar sites com efeito Parallax / Scrolling facilmente no Adobe Muse.
Para os que não sabem o que é o Adobe Muse, é um programa para criação de páginas web sem a necessidade de nos envolvermos ou escrevermos códigos. Se você já trabalhou no Adobe InDesign (programa para trabalhos editoriais), será fácil usar o Muse, pois a interface é quase a mesma e tudo é muito intuitivo. Se quiser mais informações, pesquise no Google, pois já vou começar com meu tutorial :encouragement:
1.- Primeiro de tudo, devemos ter nosso design web feito em uma única página, com cada seção uma abaixo da outra. Não vou explicar como fazer isso, pois o design web de cada um pode variar e depende de cada um e de sua criatividade, mas é a isto que me refiro:
Como veem, é uma página que se divide em 5 seções, e todas vão para baixo. As seções em questão são: 1. Início, 2. Sobre, 3. Serviços, 4. Portfólio, 5. Contato
Repito, o design já depende de cada um, mas usarei este que fiz para fazer o tutorial, que está dividido nas 5 seções que já enumerei, embora possam ser mais ou menos conforme suas necessidades.
2. Uma vez tendo nossas seções bem definidas, pegaremos a ferramenta âncora do Adobe Muse.
(Ao clicar na ferramenta âncora, nosso cursor terá a seguinte forma)
3. Selecionaremos a ferramenta de acordo com a quantidade de seções que tivermos. Quando tivermos a ferramenta selecionada, basta clicar na parte em que queremos que nossa âncora esteja. Este passo é o mais importante, já que, conforme a posição que colocarmos nossas âncoras, será a posição que o navegador descerá ou subirá e parará.
Ao clicar na parte que queremos que nossa âncora esteja, ele pedirá um nome; vamos nomeá-las para que seja mais fácil identificá-las depois.
Por exemplo, pegarei a ferramenta âncora para a seção Sobre e a colocarei onde quero que o navegador se desloque e pare; também a nomearei.
Isto é o que obteremos ao colocar nossa âncora "Sobre".
4. Repetiremos o mesmo processo de colocar âncoras nas demais seções:
E assim com todas as nossas seções.
5. Por último, para que nosso efeito esteja terminado, criaremos um menu que fique estético na parte superior para que não se mova (clique aqui para ver o tutorial de como criar menus no Adobe Muse). Neste caso, assim é o visual do meu menu.
6. Atribuiremos a cada seção do nosso menu sua âncora correspondente.
Pronto! Terminamos e devemos obter um resultado como este.
Como veem, é muito fácil. De qualquer forma, aqui deixo um vídeo tutorial feito por mim, caso não queiram ler.
[YOUTUBE]https://www.youtube.com/watch?v=a1Hmqgqmq7o[/YOUTUBE]
Link: https://www.youtube.com/watch?v=a1Hmqgqmq7o
Suas CURTIDAS ajudam muito. Gostariam de mais tutoriais de ADOBE MUSE?
Abraços
Para os que não sabem o que é o Adobe Muse, é um programa para criação de páginas web sem a necessidade de nos envolvermos ou escrevermos códigos. Se você já trabalhou no Adobe InDesign (programa para trabalhos editoriais), será fácil usar o Muse, pois a interface é quase a mesma e tudo é muito intuitivo. Se quiser mais informações, pesquise no Google, pois já vou começar com meu tutorial :encouragement:
1.- Primeiro de tudo, devemos ter nosso design web feito em uma única página, com cada seção uma abaixo da outra. Não vou explicar como fazer isso, pois o design web de cada um pode variar e depende de cada um e de sua criatividade, mas é a isto que me refiro:
Como veem, é uma página que se divide em 5 seções, e todas vão para baixo. As seções em questão são: 1. Início, 2. Sobre, 3. Serviços, 4. Portfólio, 5. Contato
Repito, o design já depende de cada um, mas usarei este que fiz para fazer o tutorial, que está dividido nas 5 seções que já enumerei, embora possam ser mais ou menos conforme suas necessidades.
2. Uma vez tendo nossas seções bem definidas, pegaremos a ferramenta âncora do Adobe Muse.
(Ao clicar na ferramenta âncora, nosso cursor terá a seguinte forma)
3. Selecionaremos a ferramenta de acordo com a quantidade de seções que tivermos. Quando tivermos a ferramenta selecionada, basta clicar na parte em que queremos que nossa âncora esteja. Este passo é o mais importante, já que, conforme a posição que colocarmos nossas âncoras, será a posição que o navegador descerá ou subirá e parará.
Ao clicar na parte que queremos que nossa âncora esteja, ele pedirá um nome; vamos nomeá-las para que seja mais fácil identificá-las depois.
Por exemplo, pegarei a ferramenta âncora para a seção Sobre e a colocarei onde quero que o navegador se desloque e pare; também a nomearei.
Isto é o que obteremos ao colocar nossa âncora "Sobre".
4. Repetiremos o mesmo processo de colocar âncoras nas demais seções:
E assim com todas as nossas seções.
5. Por último, para que nosso efeito esteja terminado, criaremos um menu que fique estético na parte superior para que não se mova (clique aqui para ver o tutorial de como criar menus no Adobe Muse). Neste caso, assim é o visual do meu menu.
6. Atribuiremos a cada seção do nosso menu sua âncora correspondente.
Pronto! Terminamos e devemos obter um resultado como este.
Como veem, é muito fácil. De qualquer forma, aqui deixo um vídeo tutorial feito por mim, caso não queiram ler.
[YOUTUBE]https://www.youtube.com/watch?v=a1Hmqgqmq7o[/YOUTUBE]
Link: https://www.youtube.com/watch?v=a1Hmqgqmq7o
Suas CURTIDAS ajudam muito. Gostariam de mais tutoriais de ADOBE MUSE?
Abraços
