diogo Posted February 29 Share Posted February 29 Hey! I would like to announce that there is a new ProcessWire powered collaboration between me and Jan Ploch 👉 @jploch. When I moved to Hamburg, I contacted him through the forum and we ended up working at the same shared office. Meanwhile we collaborated on some projects and then started our own company (a GbR, in Germany). We named it KONKAT Studio. Now we are publishing our brand new website konkat.studio As you may know, Jan developed a page builder for ProcessWire called PAGEGRID. At first, we were going to develop our website the usual way, but then we decided that we should take PAGEGRID for a spin and beat the hell out of it, to see what we could come up with 😄 We had this idea of three rows scrolling in different directions, and because PAGEGRID has scroll animations built in, we managed to do it all without writing a line of code. We may write a case study soon for those who are interested. 17 1 Link to comment Share on other sites More sharing options...
wbmnfktr Posted February 29 Share Posted February 29 This is aweseome news. Great new site, great new collab. I wish you all the best. Congrats, guys! 🍾 Honestly can't wait to see your future projects and the case study for your site. 2 Link to comment Share on other sites More sharing options...
ryan Posted February 29 Share Posted February 29 @diogo @jploch Wow that is awesome! It's completely different than anything I've seen before. It's really fun to scroll through too. I'm curious about the development side, how do you take over the scroll behavior in that way? If I view the source, there are two completely separate <html> documents in the output, how is that possible? 🙂 2 1 Link to comment Share on other sites More sharing options...
monollonom Posted February 29 Share Posted February 29 Congratulations to both of you! I wish you all the best as well. Small note: it seems the font you’re using has a (rather common) vertical metrics issue on Firefox leading to your text being cut by the overflow: hidden You can learn more / test your font here: https://vertical-metrics.netlify.app/ and then maybe get in touch to see if this can be fixed by the type foundry 4 1 Link to comment Share on other sites More sharing options...
diogo Posted February 29 Author Share Posted February 29 15 hours ago, ryan said: @diogo @jploch Wow that is awesome! It's completely different than anything I've seen before. It's really fun to scroll through too. I'm curious about the development side, how do you take over the scroll behavior in that way? If I view the source, there are two completely separate <html> documents in the output, how is that possible? 🙂 Thanks Ryan! We just take the vertical scroll position and convert it to translateX values on the rows, using requestAnimationFrame() to make it smooth. Well, PAGEGRID is doing it 🙂. There was a second <html> added by $config->prependTemplateFile. We forgot to remove it when we moved it from local to a new install in the server 🤣 Thanks for catching this! 15 hours ago, monollonom said: Congratulations to both of you! I wish you all the best as well. Small note: it seems the font you’re using has a (rather common) vertical metrics issue on Firefox leading to your text being cut by the overflow: hidden Thanks Romain! Thanks for catching the problem with the font. For now we added a max-height only for Firefox using @-moz-document url-prefix(). We'll see if there's another version of Neue Haas Grotesk that doesn't have this problem. 3 Link to comment Share on other sites More sharing options...
diogo Posted March 1 Author Share Posted March 1 Thanks again for catching the font issue @monollonom! Actually it was not Haas Grotesque causing the problem with the vertical metric. The problem was that the font was not loading at all, probably due to the file being corrupted and you were probably seeing the Helvetica present on your computer. This also must have happened when transferring the site to the server. Thanks again! 2 Link to comment Share on other sites More sharing options...
ryan Posted March 1 Share Posted March 1 @diogo PAGEGRID also looks amazing by the way. I don't have much experience with page builders, but it seems like PAGEGRID is really well thought out and does everything you could want. 1 Link to comment Share on other sites More sharing options...
diogo Posted March 1 Author Share Posted March 1 All props to Jan! The PW people are definitely not an easy crowd for a page builder, but PAGEGRID is very well integrated in the system, with all the content that you add to the page saved as PW pages (a bit like with repeaters). Also, with PAGEGRID being just a PW field, like any other, you don't lose any of the flexibility of PW. It's not for everyone — it won't appeal to pure developers that don't care so much about design, and because it requires some knowledge of how CSS works, it may also not appeal to designers who don't care at all about the platform. Hopefully, there will be enough people in that middle who will appreciate it 🙂 2 Link to comment Share on other sites More sharing options...
monollonom Posted March 1 Share Posted March 1 9 hours ago, diogo said: Thanks again for catching the font issue @monollonom! Actually it was not Haas Grotesque causing the problem with the vertical metric. The problem was that the font was not loading at all, probably due to the file being corrupted and you were probably seeing the Helvetica present on your computer. This also must have happened when transferring the site to the server. Thanks again! It does look more refined now, I was especially triggered by the animation of the “>” not being centered vertically while rotating 😄 Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now