On Brainstorm, we have already talked about the importance of building a portfolio and, of course, showcase it in a professional way. I gave you a lot of tips about this on the video that is on this card above. Today I want to be more direct and objective with you, guys. I’ll show you how you can build a professional portfolio, for free using the platform. I’ve created a complete tutorial for you. Take a look! First of all, go to and click on “Start Now” and create a new account if you don’t have one. You can log in with your Facebook or Google+ Account, too. Clicking in Register, you can create an account using your e-mail. Then, you must choose which type of website you want to create, based on the categories we have here. There are a lot of possibilites, and the best thing is that everything is fully customizable. So, for example, we want to build this portfolio website So we can go to the Portfolio and Curriculum category. You will see a lot of templates that are available. The best thing is: you can view the template before start editing. So, if you liked this template here, just click “View” and you can see how this template will look like. You can also see how the website will be on a mobile device. Just click the Mobile button on the top of the page. Every template is responsive. So, for example, you might want to create a personal website, like an interactive curriculum. You can also start from scratch, if you want. Here you have portfolio models, mosaic, header and stripes, and also go for a blank template. I have already seen many templates that we have here And the one I most liked is in the Photo category There is a template built to us, professional video editors, that we can use for free. Let’s view the Video Editor template here. We can add films, videos, many different things. I’ll show you how to edit this right now. When you select your template, click on Edit to start editing. Wix’s interface will change to Editor Mode. Here we have an “What you see is what you get” editor. It means that anything you do here, the final user will see on the published website. Basically, what you need to know is that we have a toolbar on the top with undo and redo buttons, that are important and you can save your template, preview it if you want clicking there, and then you can come back to your editor. You can use the zoom tool, publish your website when everything is done You have website options here, more tools Everything here we’ll see on this tutorial. Here, on the left side of the screen, we can add elements and make the full customization of our website. We’ll take a closer look on this during the video. The first thing you might want to do is change your backgound. If you want, you can access the website backgrounds and choose between the models saved here. Its also possible to add an image to the background. You can upload a photo get a photo from your social media or use the free library from Wix, which has many professional possibilites Big Stock library, and many other possibilites. You can also put a video on the background, uploading it or using the library You can change the whole color scheme of your website Go to “Color” to change the background color Or click “change” to choose color palettes and color schemes. If you change your color palette, you’ll have to change your images, too. Changing the color palette might make your texts unreadable. So, you may want to change your images. We can add elements by this button. Texts, boxes, stripes, vídeos, slideshows… You may want to explore this things here. Everything is free for us to use on our website. Before adding anything new, I’ll show you how you can reposition your elements here. As you can see, when we hover the cursor over the elements the name of the element is shown here. So, I can move the video, the frames, etc. Those frames are just like a safe grid from a video editor, it is cool! Those rectangles are like television and cinema screens… nice! The REC button here… really good. If you want to make this content here go a little bit down so we can put a text over here, above all You can use everything as if it was Photoshop. Single-clicking on the elements, you can select them Pressing SHIFT you can multiple select the elements And by clicking and dragging, you can move everything here. These rulers here are telling us if the elements are centered or not. You can also edit the stripe on the background, moving it and rescaling everything here is possible. I’ll not change anything on the stripe, it is just for your information. So, let’s think that I want to add a line to divide the content from the header to my video. So, I can add a new Form>>Line Since I added a new object, shows us some tips which comes really handy, since you can learn while you edit! So, I can change my line size and make it full width. Let’s put a title above our video. We can add it through our “Add Text” box I’ll import this Catchy Title preset here. I’ll place it on the center of the screen When we double-click the text box, we can edit the text. I’ll add “Demo Reel 2017” I can change its color, make it white, for example. I can also change the font size… And you can see that the elements will be adapted when we make those changes. I’ll align it on center. And now we have a title for the video below. Really cool! You can also edit all this text on your template. So, you can change your name up above. I’ll put Mateus Ferreira, my name, here. I’ll also add my profession title, my location here You can also edit these paragraphs on your content And a special tip for you: since we’re working with a template, you must change everything that you can. The template is just an idea of how your website can look like, at the end. So, try to change as many things as possible here, so your site won’t look like somebody else’s website. Edit your website as you wish. Here, you can also change your background image. I’ll change this one, with the film, for another one. Clicking on the background, you can go to “Change Image” and upload your new image. When I click apply, my new background goes online. And with my image up here, I can change its configuration, its position, size, and many other things as you’ll see. The Wix Image Editor is really cool, you have many useful tools to cut, resize and edit your photos You have full control over your photos using the Wix Image Editor. Now, let’s think that you want to remove one of these content stripes here. Maybe you’d like to remove this “Film” content stripe here. Use the button “Reduce Zoom” to enter the organization mode of Wix Editor Here we can manage all the content stripes from our website. Click on a content stripe and go to “Delete” to delete your content. Now, if you want to reposition any of the other content stripes, you may just click and drag to do so. Cool, isn’t it? Click “exit zoom out” to leave your zoom interface to go back to our original editor. You can also create new pages for your website. If we come to our preview window, we’ll see that our website has only one page. If you want to create a page telling a little more about yourself, you’ll see that it is pretty simple. Back at the editor, click “Pages” and go to Add Page Give a name to your new page, like “About” And on this new page you can add anything you want. I can add a text box here It is a paragraph and I’ll place it here. Now I can go ahead and edit my text. If I want to add a photo of mine here, I’ll go to Add new Image and I can upload my own photo here, and edit as I wish. I’ll place it right here on our example. I can also add a video here, if I want. Just need to go to “Video>>Add Video” and choose if I want a Vimeo or YouTube video. And I can place it anywhere, and change my video by double-clicking on it and changing my URL. Here’s our video. Great! If you want to go back to your homepage, go to Pages and select your first page. Here on WIX, you can also work on your SEO (search engine optimization). You can edit your SEO settings here on your Pages editor. Add your title, description and other metadata. A tip for you: study these SEO techniques, so your website is found easily on search engines. Here you have a preview on how your snippet will look like on a Google search page. SEO is really important for your website. Study it. Anchors are another great feature here on Wix. Here above we have a menu, that can point to your pages, or to your anchors. Anchors are for redirecting your users to a section of your homepage. E.g. your contact form. You can add new Anchors, by clicking Add>More>Anchors. Click and drag your anchor to a content stripe you want you can read this tip that explains how the anchor works… You can name your new anchor, like: contact. Now, you can add a button to your menu, with a link that goes to your anchor. Choose your anchor here: And you can edit your button text If you want that this button show up only on homepage, right-click it and uncheck “show on all pages” and when you enter on another page, this contact button won’t appear. When we preview our page, we can click on the button, and the page will scroll to our contact form. Cool! Go to Website>Site configuration to change some configs on your pages First, save your website if you didn’t do so yet. Don’t forget to give a cool name to your site. On your configuration page, you’ll see many parameters that you can edit or adjust There are many preferences as you can see here… SEO preferences, analytics, domain names, upgrades… you can add new members to your project, so they can also edit the website! Many preferences that you can adjust here. Cool! You can also start you own blog here on Wix platform! That’s an option you have to boost your website’s SEO, since Google really like written content! There’s a full blog interface here, where you can write and add new posts, edit, many cool options here! And you are free to move between you blog, pages and homepage for editing. And now, finally, you can go ahead and publish your website when you feel that it is done! Click “publish” and your website is good to go! It will be online very shortly. A final quick tip: always use a custom domain name. It is more professional and can give you more chance to get better clients. And that’s how you create a website using WIX.COM! Hope you guys understood it and liked the tools 🙂

, , , , , , , , , , , , , , , , , , ,

Post navigation

81 thoughts on “Como criar um WEBSITE PROFISSIONAL

  1. Nossa, o Wix evoluiu muito.

    Quando ele chegou ele era muito fraquinho kkk

    Estou pensando até em usar ele em um negócio que tô prendendo fazer.

    obs. a Wix poderia ter te patrocinado por isso mano.

  2. Também acho que vc deveria fazer um curso de after efects no canal seria de grande ajuda para mim e muito outros que pretendem utilizá-lo agora ou futuramente.

  3. Você não precisa me falar que da para criar um site usando o WIX. Os 5 sec antes dos SEUS vídeos sempre me falam… Hahahaha

  4. Mateus, eu conheço um site que se chama codecademy, queria que vc ensina-se na parte desse site que é "Deploy a website" não consigo entender esta parte nem mesmo com o Google Tradutor!

  5. Nossa, agora eu quero criar um site XD Eu iria excluir ele 2 segundos depois de fazer, mas parece tão interessante e divertido ver todas as opções que essa ferramenta tem XD

  6. FAZ UM curso de AFTER EFFECTS no seu SITE BRAINSTORM CURSOS POR FAVOR, gostaria de aprender como vc faz a logo do instagram entrar na tela e sair e umas paradas assim.

  7. Galera, muito obrigado a todos pelo feedback, tanto positivo, quanto negativo. É importantíssimo pra nós saber a opinião de vocês sobre tudo que a gente traz aqui no canal! 😀 Só quero lembrar vocês de sempre serem respeitosos quando forem deixar um comentário. Convenhamos: dizer que "o produto é uma bosta", além de não contribuir em nada pra discussão, demonstra até uma certa incapacidade de argumentação, né? Poxa, vocês são melhores do que isso, galera! No mais, novamente agradecemos o engajamento! Apesar das críticas, jamais vamos tirar a barrinha de avaliação do vídeo (coisa feia fazer isso hein), e, acima de tudo, continuamos amigos (assim espero :P). Valeuuuu!

  8. Matheus eu baixei um plugin s,shake Dai tudo certo veio um monte de pluguin junto daí usei ne um vídeo e Ta ficando preto as partes q eu coloquei o Shake afs man N Posso perder a edição Fiquei 9 Horas editando e ainda tenho q ir edita no after amanha !


  9. Galera que tá criticando o Wix, pra quem não tem nada, quer começar a montar o portfólio afim de ingressar no ramo audiovisual, sem grana pra pagar programador e sem tempo para criar um site "na mão" usando WordPress e afins, vale a pena iniciar pelo Wix? rs

  10. +Brainstorm Tutoriais – Edição de Vídeo
    Eae Mateus, Vc têm algum vídeo a comparar o Premiere com o AfterEffects?

  11. vídeo perfeito mano. Uma pergunta, quero criar um site onde as pessoas possam publicar cifras, estilo cifra clube, nesse site tem como?

  12. O ruim é que sites da Wix são péssimos para serem lidos pelo robo da Google. Ou seja, é péssimo pra ser encontrado no Google. Eu gosto de usar wordpress e hospedar no Openshift (de graça para sites pequenos) e depois só compro o dominio e puft.

  13. Mateus, uma dúvida:
    Eu já  fiz registro no Já paguei e tudo. Não tem como eu usar esse domínio que eu já paguei no pro design que quero fazer no wix?

  14. Mano…. n percebo, este canal devia ter 1 Milhao de inscritos…. Ate fico pasmado, como um canal destes apenas tem 300 k de inscritos!! MALTA, DIVULGUEM ESTE VIDEO, PARA TODO MUNDO, VAMSO ACABAAR ESTE ANO COM 1 MILHAO DE INSCRITOS NESTE CANAL PRECIOSO!? SIGA

  15. Estou precisando de alguém que faça um site responsivo com um sistema de usuario e senha pra mim… quanto você cobra pra fazer um site assim ?

  16. É uma plataforma encrivel eu gostei só o unico problema é que se vc linpar o historico do navegador nunca mais vc edita seu site publicado se fiser o site com wix nunca linpe seu historico ai vc edita quando quiser

  17. Olá pessoal, estou divulgando meu video com Mobirise, para quem tem interesse criar websites com técnica de Drag-and-drop. Muito simples e totalmente responsivo. Vejam o video:

Leave a Reply

Your email address will not be published. Required fields are marked *