Wix Design Tutorials: Creating a One-Page Website with Hover Effects
ฝัง
- เผยแพร่เมื่อ 8 ส.ค. 2018
- In this tutorial, I’ll show you how to create a one-page website with interactive hover effects. I’ll also add the Wix Music player. This technique is great for any website, but especially when designing a musician portfolio or album release.
Play with this website: www.wix.com/website-template/...
Wix.com
The Web Is Your Playground
Start Creating: www.wix.com/designers/playground
![LISA - ROCKSTAR (Official Music Video) REACTION [SHE'S BACK!]](http://i.ytimg.com/vi/QBxE30vavMQ/mqdefault.jpg)
Great job. Love the way you think about pushing the limits of web design. The result looks like it was done with really sophisticated motion graphics tools. Impressive.
So amazing. This is really a Playground!
this tutorial was outstanding and the website is beautiful!
This video is AMAZING. Thank you for creating this!!!! Thank you! Thank you!!
SUBSCRIBED. Thank you so much, this is beautiful.
FANTASTIC Tut. I am going to use the video slideshow and the revealing text - am excited to try... Thanks a lot.
This was sooo slick!
Very Well Explained. Little bit fast, but this is not an issue. You have created a 1 page website within 10 mins. Well done. We need to be able to do all these things without trying to learn at the same time. But overall very good. Keep up the good work. Thanks
Super cool video tutorial. Thank you very much. I am doing my first steps in website design. Hope to become an expert like you guys.)
Beautiful design and awesome tutorial to follow. Keep them coming!
I guess Im randomly asking but does any of you know of a way to get back into an Instagram account?
I somehow forgot my password. I would appreciate any tips you can offer me!
@Terrence Lukas Instablaster :)
@Matteo Trace I really appreciate your reply. I got to the site thru google and I'm trying it out atm.
Looks like it's gonna take quite some time so I will get back to you later with my results.
@Matteo Trace it worked and I actually got access to my account again. I am so happy:D
Thanks so much, you really help me out :D
@Terrence Lukas glad I could help :)
Stunning!
dang you smooth lol It takes me forever
you guys are awesome!! I had to say it.
this channel really change the perspective that Wix is too limited for designers. Wish there were more content. There aren't any new content in like A YEAR
wow, great tutorial! thanks
I saw you sped things up, but wonderful explanation 👏👌
So cool! ✨
This shiiit is fire. Loved it keep it up
It's awesome!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! Thx so much
Great work - question do you get the same when you switch to mobile preview ? I get everything over the place
thanks!!
Amazing, thx
@@wixplayground7678 are you will continue?
@@wixplayground7678 both lol. But more tutorials for Wix :)
Thank You
Hey man, great tutorial! Thanks! On the example website, you made a menu bar (Top, My Music, Info, Video, Follow me)... and when one clicks it scrolls down to the section on the page. It would be awesome if you could share how you did that! Good vibez! :)
Buttersmooth voice
Wonderful design and this expanded my knowledge of wix. I was wondering if this design style has a good solution to design a mobile version via using wix?
@@wixplayground7678 Thanks, I agree that this style might mainly suit the desktop end. Thank you for your tutorials, among all Wix tutorials on youtube, your tutorials have the best sense of design. Looking forward to watching more videos from your channel.
I agree with @willmeisha these videos made me realize wix is actually really usable
This is a great video I ever came across...I have been using wix for my clients but I just discovered all the uses of the hovers and light box in another beautiful way...I will give this a trial...but does these designs look good on smaller desktop screens and mobile?
Carrd is a new site that is MUCH more affordable than Wix and the other sites. They have a free plan, and their premium plans start at LESS than $1/month!!! that's unheard of! use Coupon code: COUPONSAVE to save 30% on premium plans (just $5/ year!!!) try.carrd.co/couponsave
@@anaangel622 very bad alternative for anyone reading this
This worked awesome on a fully stretched version of the website, but when resizing the letters start getting on top of each other. Any solutions?
after hours of googling, this wow
Okay I have been trying to get to hover things to work and it is just not doing it for me. I’m following the instructions step by step 😭 can you reexplain that section in another vid but a little bit slower
thanks
Hi, is it still possible on hover edit mode to select multiple objects at the same time and then align and distribute them as you show here?. I can't use the align tool (it's grayed) or make multiple objects selection in the box while in hover mode ( Chrome and Firefox - February 2021). For example, on Regular mode I have different texts/words spread on the box, when on hover mode I want them to animate as you did with the album name in this video. Seem like the UI and the way wix hover mode works changed. I can't understand why wix changed it. Looks like it used to be possible when you did this video.
great design work! question- since you used elements outside of the Wix Grid Guidelines, does that mean not every device will be compatible with your design? You may run into some issues when sending the site out to clients who don't have a monitor that can stretch the length of the design you've made. Unless you know of a fix to this problem, I wouldn't recommend making a site using this creative text. if you know of a solution to this obstacle, we'd love to hear it!
There isnt, while this video is outdated, wix still havent added responsiveness to the editor. Editor x would be the alternative.
adding the strips and columns allows you to work in the space that he did. Thats why he added the strips and columns when wanting to add things on the sides, so they would still be optimized for all viewers.
@@nocknocktheproducer That’s what I was thinking too.
If it's too fast for you, slow down the playback speed!
Exactly. This is a nice change from having to speed things UP for people who've been designing in Wix for years but still like to get inspired here👍
Why does the text in the hover boxes apply on both normal and hover on its own?
Another vid that races through.
so cool. can it be used in wix as well?
All of the websites in this channel called me untalented in 1000 different languages
feel the same :D
Great vídeo!! It looks great!! But as most of the people access websites from their phone, the video background isn't available for mobile version :(
Wix has a desktop and mobile version as well
where can I get the video animation playing
is this website responsive to the device's screen size?
Mannn awesome how much do you charge?
Damn!
Amazing and simple to learn. Just one thing, I can’t resize the background video for mobile view. It plays but it’s so stretched out it’s impossible to see what’s going on.
I uploaded the background video from my computer straight to wix gallery since I don’t have TH-cam. Is there a fix to this?
How you uploaded your own video
can you plz tell me where I found your videos ?🙏🙏🙏🙏
but is it great in mobile?
How does it look on mobile?
how does all of this translate into mobile view?
How do you make templates?
how will these effects display on mobile? I love your design and have issues when they transition to the mobile devices
With wix you can customize your mobile site, almost independently of the full site.
I wonder what the performance of the site would be with all those overlapping elements and JavaScript.
Wix is the best.
You can't.. No video background available on mobile
with those skills, you may be making 6 figures income
it took you 10mins what took me 1 week and counting lol
good video but way to fast, please next time can you explain just a little slowly so that way the tutorial is easier to understand... but thanks
You can reduce the playback speed on the video setting
@@christianadaniel2751 You're missing his point.
This isnt meant for beginners
The video is going too fast to learn properly slow it down
Can't we add our own videos and images?
you can
Boss website design
too perfect to be true, can i have the designer's name?
lol that was a butt-y way of saying that
Can o hire you to do my website
Fantastic info but going way too fast. For future videos please slow down. Thanks!
just to fast but great work
Great video and design techniques but way too fast.
or prob u r 2 slow, do you want a one-hour vid instead of?
You know more wix tricks than I do on my website - www.sewellstephens.com
Your welcome
I forgot to tell you, since you did such a good job with this video, I will even pay you if you help with the AdWords promotion tool. Here is the url: www.sewellstephens.com/account/promotion
Super inspiring. Your video offered insightful ways to create a webpage that is striking and interactive. T h a n k y o u . . .
1- Everything is beautiful in Wix:
but the sites are very slow to load pages, especially in phones and tablets This is uncomfortable for the customer Please pay attention to this.
2- And I hope there will be more applications and more programs work with Wix.
3- A mobile application is beautiful
but it is work very slow to upload pages and to control it working slowly
4- The big problem is when you build your website on the Wix platform You don't have full control of the mobile or tablet field to customize your side.
5- When I add the new task on the Wix mobile or in Wix platform
I don't receive notice of this task when it's time.
Sometimes I received by email only.
Please pay attention to all this feedback thank you
-------------------------
High On Design Thanks for your quick reply and I hope there’s solution for this issue thanks 🤗
💤
Great info and way too fast. You're doing this faster than real time and trying to teach people who want to learn this. S-l-o-w down, please!
you can change the speed of the video yourself in settings to follow along
I didn't find this too fast
Honestly it's alright to me, at least way better than having to put a tutorial on x2 because they talk too slow
To fast if he can work as quick as that wow it makes it unreal why are so many TH-cam creators trying to be so fast with speech and vids. I presume they have something good to get home to.!!!
way too fast.....
Way too fast.
on youtube.. there's pause. I like it fast so I can quickly see and remember the steps.
NOT to mention, half these features won’t work on every device I’m finding with wix. Very janky platform tgat seem to only work best on Androids. Which means it was designed by foreign designers. Which means they don’t understand how vital it is to run smoothly on Apple products. Other countries use android as the standard. But Androids gives inferior editing and video playback performance compared to Apple devices. But wix looks and acts kinda shitty on Apple devices.
Absolutely zero responsiveness... forget tablet or mobile view
you are just too fast
Way too fast
YOU have the right idea, but you’re a good teacher I’m sure, maybe youre just a terrible editor. You leave way too much detail out. You assume the viewer knows ANYTHING about the things you do but never mention it’s location. These things are often deeply hidden. This Wix editor has been a huge waste of time so far, as is, and your speedy vague explanations didnt make it that much better either I guess. But looks really great visually.
bruh wat
Terrible videos by you'll for people here to learn. You need to understand UX before throwing content out.