5 ms·

I think this works because the little videos in the breaks actually do a great job of complementing the content of the article (and happen to be pretty). There

by arscan 14y ago

I think this works because the little videos in the breaks actually do a great job of complementing the content of the article (and happen to be pretty). There was a link yesterday on HN that used a similar technique, but the breaks were static images that didn't really add anything to the content of the article [1]. Sure, they're pretty and novel, but I thought the breaks did more harm then good for somebody actually reading the interview. They were more distracting than anything. I have a feeling that we'll see a lot more of this technique in the future. I personally hope that it doesn't just get slapped on for its visual appeal, but rather as a medium to present value-added content (like this NY Times article did). [1] http://womenandtech.com/interview/heather-payne/ http://womenandtech.com/interview/heather-payne/

tapp 14y ago
Completely agree on both counts. As designers and developers it will be difficult to resist the urge to replicate this all over the place purely for the visual impact, but I hope we don't. The use was so fantastic here precisely because this sort of story cried out for exactly these tools to provide a deeper understanding.
sharkweek 14y ago
Pitchfork (the music review site) employs this technique for their "Cover Story" features, some are better than others. I personally enjoy the "alive" feel of the stories: http://pitchfork.com/features/cover-story/ http://pitchfork.com/features/cover-story/
- arrrg 14y ago
  Beautiful, but one fatal flaw is that they make the font size dependent on window width. I usually have to browser windows open and next to each other, each using about 720 horizontal pixels. With Pitchfork’s layout that results in way too tiny fonts. I think it’s fundamentally wrong to make font size dependent on viewport width. What you want is to make it dependent on ppi and typical viewing distances (a phone can get aways with a smaller font because compared to a laptop, viewing distances are shorter) you can expect on the device that is used to display the content. Sadly, there is no straightforward way to access this information and we are currently limited to educated guesses.
  - mattdennewitz 14y ago
    > I usually have to browser windows open and next to each other, each using about 720 horizontal pixels. call me crazy, but the way your arrange your windows is not really a use case we design for at pitchfork. i agree that there may be a better way to do this, though, but we made the choice to scale fonts to viewport because we want a certain amount of information to look a certain way per page.
    - arrrg 14y ago
      Ah, that's just my own pet peeve. Web design is full of trade offs and I think you made the right one. It's really not a good idea to view those articles with a 720px wide viewport. As I said, beautiful work and keep it up!
tsunamifury 14y ago
I dont think this works at all. Its heavy, difficult to read, and full of distractions. The fade in animations are unnecessary and the parallax scrolling adds nothing to the story. The multimedia functions more as footnotes or interruptions that route you outside of the narrative. Its mobile-unfriendly and breaks the UI of NYT.com.
- anigbrowl 14y ago
  I hated it. If I wanted this sort of thing I would watch TV.
- jobu 14y ago
  Wow. I couldn't disagree more. The integration of the extra content to the context of the story really added another level for me.
- omegaworks 14y ago
  I liked it in principle - hated it in practice. The scroll-triggered animations were annoying. My internet happened to burp in the middle of reading the article and I was left with a lot of blankness and loading, until I reconnected AND refreshed the page. The animations started playing right as soon as I scrolled on to them, meaning they were partially obscured until I scrolled to a certain point. If I accidentally passed that super special point, they were abruptly obscured on the opposite side by the rest of the article.
subpixel 14y ago
Holy crap is that womenandtech format awful. It's like the internet version of a really bad pop-up-book.
victoro 14y ago
One of the best integration of multimedia and text that I have seen in 15 years of being on the internet.

by arscan 14y ago

tapp 14y ago

Completely agree on both counts. As designers and developers it will be difficult to resist the urge to replicate this all over the place purely for the visual impact, but I hope we don't. The use was so fantastic here precisely because this sort of story cried out for exactly these tools to provide a deeper understanding.

sharkweek 14y ago

Pitchfork (the music review site) employs this technique for their "Cover Story" features, some are better than others. I personally enjoy the "alive" feel of the stories: http://pitchfork.com/features/cover-story/ http://pitchfork.com/features/cover-story/

arrrg 14y ago
Beautiful, but one fatal flaw is that they make the font size dependent on window width. I usually have to browser windows open and next to each other, each using about 720 horizontal pixels. With Pitchfork’s layout that results in way too tiny fonts. I think it’s fundamentally wrong to make font size dependent on viewport width. What you want is to make it dependent on ppi and typical viewing distances (a phone can get aways with a smaller font because compared to a laptop, viewing distances are shorter) you can expect on the device that is used to display the content. Sadly, there is no straightforward way to access this information and we are currently limited to educated guesses.
- mattdennewitz 14y ago
  > I usually have to browser windows open and next to each other, each using about 720 horizontal pixels. call me crazy, but the way your arrange your windows is not really a use case we design for at pitchfork. i agree that there may be a better way to do this, though, but we made the choice to scale fonts to viewport because we want a certain amount of information to look a certain way per page.
  - arrrg 14y ago
    Ah, that's just my own pet peeve. Web design is full of trade offs and I think you made the right one. It's really not a good idea to view those articles with a 720px wide viewport. As I said, beautiful work and keep it up!

tsunamifury 14y ago

I dont think this works at all. Its heavy, difficult to read, and full of distractions. The fade in animations are unnecessary and the parallax scrolling adds nothing to the story. The multimedia functions more as footnotes or interruptions that route you outside of the narrative. Its mobile-unfriendly and breaks the UI of NYT.com.

anigbrowl 14y ago
I hated it. If I wanted this sort of thing I would watch TV.
jobu 14y ago
Wow. I couldn't disagree more. The integration of the extra content to the context of the story really added another level for me.
omegaworks 14y ago
I liked it in principle - hated it in practice. The scroll-triggered animations were annoying. My internet happened to burp in the middle of reading the article and I was left with a lot of blankness and loading, until I reconnected AND refreshed the page. The animations started playing right as soon as I scrolled on to them, meaning they were partially obscured until I scrolled to a certain point. If I accidentally passed that super special point, they were abruptly obscured on the opposite side by the rest of the article.

subpixel 14y ago

Holy crap is that womenandtech format awful. It's like the internet version of a really bad pop-up-book.

victoro 14y ago

One of the best integration of multimedia and text that I have seen in 15 years of being on the internet.