Jump to content

Patina — Unikate für den Alltag


diogo
 Share

Recommended Posts

Hi guys, here is our most recent website

http://patina-store.de/

Patina is a really nice vintage objects and furniture store here in Wuppertal. Pay a visit if you pass by ;)

We are aware of some flickering and strange scrolling (seems to happen with Safari on desktop and iOS) on the homepage initial transition. I'm looking into it, but if you guys could report how it's behaving with you, it would be a great help!

A point of interest is the Lookbook page. For this we used the Image Marker module by @kongondo and @heldercervantes, which worked flawlessly. Thanks guys!

Although the site is very simple, PW has a very important role, since we transitioned all the shop organization (mainly the products) from excel spreadsheets to it. We could say PW is acting as a small CRM, and Lister Pro is doing a great job at it.

  • Like 19
Link to comment
Share on other sites

Very nice!

One issue I noticed is that if you scroll down one increment of the mousewheel, as well as triggering the animated scroll past the hero section the text below is also scrolled, meaning the first couple of lines are already obscured behind the header.

2017-12-16_110315.png.0888045f6eeb9dda043e0d417a78d7a8.png

How many text lines are scrolled perhaps depends on the OS mouse settings.

Maybe you could somehow capture the first mouse scroll interaction so that it only triggers the hero scroll and not scroll the rest of the page content?

  • Like 1
Link to comment
Share on other sites

29 minutes ago, Robin S said:

Maybe you could somehow capture the first mouse scroll interaction so that it only triggers the hero scroll and not scroll the rest of the page content?

@Robin S thanks for reporting! I tried to do this, but for what I've seen, that's not possible. To catch the scroll event, it can't be deactivated... unfortunately there's no way to capture the user action (rotate mouse wheel or swipe on the pad), only the scrolling itself, so there's no way of preventing that first movement. I'll continue looking into this. For now, I just added an animation that repositions the content in the place that it should be. In my chrome the movement is quite elegant and in the ipad is so-so. I'm not sure how it will look in other devices, but it should at least solve it in your case.

 

59 minutes ago, SamC said:

Wow! The lookbook page is deliciously smart :) 

@SamC thanks, that's great! ^-^

Link to comment
Share on other sites

19 minutes ago, diogo said:

For now, I just added an animation that repositions the content in the place that it should be.

That did the trick.

Another little thing I noticed is your font stack:

font-family: "Hind Madurai", "woodford_bourne", sans-serif;

You are specifying "Hind Madurai" from Google Fonts as the first preference, but this is not actually rendered anywhere (that I could see) and instead all the text renders in the first fallback "woodford_bourne" which you are self-hosting. So maybe "woodford_bourne" is actually the typeface you actually intend to use and specifying/loading "Hind Madurai" is unnecessary?

  • Like 1
Link to comment
Share on other sites

We're loading only the @ from Hind Madurai, notice the import line:

@import url("https://fonts.googleapis.com/css?family=Hind+Madurai&text=@");

I know we're being picky, but we really really dislike the @ from Woodford Bourne.

Anyway, thanks for digging in and telling me what you found. I appreciate it.

  • Like 4
Link to comment
Share on other sites

6 minutes ago, diogo said:

We're loading only the @ from Hind Madurai

That's a great tip, will do that myself in future. So often an otherwise nice typeface has a weird unrecognisable ampersand or something. Cases in point...
http://www.myfonts.com/fonts/font-fabric/nexa/regular/glyphs/716952/445
http://www.myfonts.com/fonts/intelligent-foundry/averta/regular/glyphs/756381/1184

Link to comment
Share on other sites

nice site :)

2 suggestions (or maybe more 1 suggestion and 1 feedback):

  1. it would be nice to have different markers for sold/available - can save lots of clicking.
  2. i would prefer opening the details on hover and not on click (needing a little caution on mobile of course)
  • Like 1
Link to comment
Share on other sites

On 17/12/2017 at 12:34 AM, heldercervantes said:

First scroll... WHOA!

Love it.

:D

 

On 17/12/2017 at 12:55 PM, bernhard said:

nice site :)

2 suggestions (or maybe more 1 suggestion and 1 feedback):

  1. it would be nice to have different markers for sold/available - can save lots of clicking.
  2. i would prefer opening the details on hover and not on click (needing a little caution on mobile of course)

@bernhard thanks!

1. Good idea! I'll ask the client if they want this change.
2. I think we'll skip this one. I'm not a big fan of too many things happening on hover.

  • Like 1
Link to comment
Share on other sites

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 account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...