Hi all, one client of mine has pushed online a single pager I had done for them a little while ago. It’s 1001pneus.com wich in english means 1001 Tires. It’s a pure player selling tires online.
When I delivered the site, I said to my contact “The first section is full screen, you can use it in your stands and booths during events or whenever.” and they actually do it, a lot. It’s in their reception office, and on all flatscreens they have around the office space. They just sent me these pics:
An I got an idea, we’re discussing it: I want to make a second page for those websites, with another version of the first section, really dedicated for this full screen “booth” usage. I would use a longer video, very much less compressed, because this suage can suffer loading time, it’s not a browsing use-case. I will also rething the layout to take advantage or the 16/9th ratio.
I will now advertise that on top of a website, you’ll get an animated full screen section crafted for flatscreen use, optimized for either 1080p or 4K. I’m going to look if I can make it easy to add bricks of information to turn this into a usefull dashboard in the future.
That I think is a fresh, fun and effective piece of dev and you should/can all advertise this to your clients.
This is lovely! May I inquire as to why you used pngs over SVG’s for your graphics?
Took a few minutes but went ahead and made the map into an SVG for you may need some color changes, but easy to make in illustrator. http://we.tl/mhyl1pwaqM (couldn’t paste it in here so here is a wetransfer link).
The only other thing I’d suggest is changing your hover interactions on class “sochaux-link.” Currently, hovering on the links changes the background opacity on all the links. I’d suggest setting it for each individual link on hover.
Well you’re the one to like it I could never got used to it, I even made them change this tone during the web dev. happy that you like it because I’m not satisfied with it (: I suck at colors really.
Yes you’re right, originally I designed the whole bar to be ultra subtle, and a hover on the bar would bring it up. One made me change for a less subtle bar and I haven’t rethought the hover event afterward.
Haha thanks, I have it in vectors already, I design everything in vector. For SVG, I go SVG with my ongoing clients, the one I work with all the time, because in case of trouble I can act quickly. This is most likely a one shot and I wanted to make it super solid and have no compatibility issue whatsoever with this very important first section. As it can run on a TV, I was thinking it could run on a TV/Cable set top box and who knows what browser they use on that right?
Otherwise I’m a strong advocate of SVG. Everything on www.kds.com is SVG and I start to learn how to add classes, add inline svg to style them within webflow, make svg animations, states and interactivity. SVG is really cool, that would be fantastic if Webflow was the first live editor to bring SVG control, for files and inline. For the moment I play with this, where I put the SVG inline and add a mini stylesheet right in the same custom HTML block.
Yes it’s a client I dragged into Webflow 16 months ago. For great visual benefits. But they want to go back to CMS now so I won’t be doing webdesign for them anymore, but still design. I understand their decision, it’s hard to lose control over design. They expect the same result with a CMS, and they’re right to because it’s feasible. It would just be too much work for myself and now that I’m so comfortable actually working on designs with Webflow rather than spending a lot of time dealing with responsiveness and compatibility, I prefer not to. I had dreamt to bring them more into Webflow and set an Organization plan for it, but it just requires too much technical/design skills at the moment so they didn’t engage. And to be fair the org plan is more for a collaboration between profiles like devs and designer than for a designer to client collab.
You open the svg in a text editor, you add class=“classname” to the code after a group (<g>), then you paste all the code in an HTML widget, then you add a bit of css as the images shows. The image shows almost everything there (:
The truth is i can go on and spend a year figuring it out but you can make it a whole lot easier for me and others, if you make a tutorial, please. I am one of your disciples and another thing, webflow can then incorporate this into the platform when they see many of us using this, starting from You,