Adopting the Native Language of the Web — Designer vs. Developer #3

Adopting the Native Language of the Web — Designer vs. Developer #3


SPEAKER 1: Digital
design previously was quite influenced by the
world of graphic design, in that the language
that we use– above the fold– came
from the print world. And it does feel like
we’re getting back to that restrictive
space again, especially with native versus web and
all these other meaningless debates, when we’re ignoring
the user experience. What’s your feelings
on some of these, or language being
influenced, and where we are right now in industry
in terms of influence? SPEAKER 2: So I feel like we’ve
gone from a world where we took our language and our
inspiration from print and we applied those constraints
to the web to a world now where we’re taking our
language and our constraints from native apps, and we’re
applying that to the web. And what I’d love for us to
do is to end up in a world where we have language
and ideas that are native to the web
itself, that embrace the fact that the
web is hypertext, not just another way
to build native apps. One of the projects
my team works on is the Progressive
Web App Directory. And we’ve been trying to
collect a lot of people’s progressive web apps
and capture metrics– currently [? Lighthouse ?]
[? goals, ?] but we have plans to bring in other metrics. And when you see a few
hundred PWAs all in one place and you go through
them all, you start to see common conventions. SPEAKER 1: Like
design patterns, UI. SPEAKER 2: Exactly. SPEAKER 1: Such as
the hamburger menu? SPEAKER 2: So the hamburger
menu is a classic one where it’s in there, even though
most people in the native app world are looking at
it and saying, well, actually, we’re taking key
functionality in our app and we’re hiding it
away from the users. And we’re discovering
people can’t find it. But you’ve seen people
redesign to go away from the hamburger menu. You look at, say,
the YouTube app, and we’re going to interfaces
that expose the functionality and make it discoverable,
make it obvious. And I feel like for
the web, we have to go through the same process. But it can’t just be following
the taillights of native. It has to be saying, if I’m
building something for the web, it has to be responsive. Because on the web,
the same URL can be seen on a
four-inch iPhone all the way to a 30-inch monitor. And so it doesn’t respond. And Progressive Web App
Directory is guilty of this. We are working to fixing it. We end up with a world where
it looks fine in your phone, but on your massive
desktop monitor, there’s a little bit of
functionality swimming in an ocean of white space. SPEAKER 1: Yeah. Do you feel that we’re
abandoning responsive web design? Because it felt like for a
while, maybe 10 years ago, there was like the
revelation of grid, and that we’re designing
in the wrong way, so hence producing
the wrong thing. So fixed pixels
became abandoned. But do you feel that
responsive web design is now being abandoned,
because we’re following very strong native patterns, as
opposed to following the web? SPEAKER 2: So I think yes. But the weird thing is we now
have the tools to do responsive really well. We have the understanding. And just as we’re
getting to that, it’s become something
that’s boring. People aren’t doing it. They’re going, well, actually,
here’s an adaptive solution. Or here’s a thing
that assumes we’re going to have a mobile dot,
or an m dot, site that’s going to be very app-like. And then we’ll have some
legacy thing for the desktop. And yeah, it does feel
like an abandonment of responsive design. But we don’t have
something to go to instead. I feel like we
still, when we think about designing
for the web, we’re still stuck in what
our tools give us. So if our tools assume
we design with a bunch of static images, a
set of static screens, we’re stuck in that box. Whereas we should be
thinking, what is the content? What is the sub screen module? What is the thing
that we want the user to do on all of these screens? How does the user get from this
page to this page to this page? Notice I’m using print language. Because I can I
say page to page, and people know what I mean. Or I can say screen to
screen, and people think I’m talking about native apps. SPEAKER 1: Yes. SPEAKER 2: But we
don’t have a thing that is native to the web. Probably my favorite
example of something anybody ever did about this
is a PhD thesis by a guy called Tom Formaro. SPEAKER 1: OK. SPEAKER 2: And it
tries to tell us that if you want to make
an argument in a hypertext environment, you can’t
assume the user is going to start at the beginning,
at your front page, and then linearly go through it. They’re going to come in
at some arbitrary point, and you’ve got to give
them multiple paths to get to all of the relevant
bits of the argument. And since his work
15, 16 years ago, there’s been very
little that I’ve seen. And there’s been
very little that I’ve seen make it into people’s
production web apps or production websites. In fact, one of the
questions I often asked myself is,
what if we hadn’t called these things
progressive web apps? What if we’d call them
progressive websites? What would be different? What would we have changed? Which conventions would
we have established that we don’t have now? SPEAKER 1: So do you think
the word app has influenced us to design from the
UI to the patterns and conventions of native? SPEAKER 2: Yes. And if you were to imagine
a world where we will say, well, actually, you know what? We’re happy that the web is
not like an app environment. We like the fact that the web
is a hypermedia environment. And when you look at
the web, and people, they take the hypertext
aspects for granted, just like people take
responsiveness for granted. And then it’s very easy to
say, well, actually, this works on my phone, and
it works my other phone. It’s responsive enough. SPEAKER 1: But
isn’t that a problem with, say, mobile first? And us focusing, going from
the extreme of desktop only to the extreme of only
mobile– hence the m dot websites, or some of
the challenges PWAs face. SPEAKER 2: I think you’re right. I think we also confuse building
something that’s mobile first with building something
that is native to the device the user has. So if you think about an app
or website that really exploits the user’s device,
they’re going to ask, what capabilities exist
in this device that don’t exist in other devices? And as these
capabilities evolve, as new capabilities get added,
we should be asking ourselves, what can we do now that
we couldn’t do before? So probably the most
interesting new capability that’s being added to
devices is fingerprint. And you’re seeing more and
more apps say, well, actually, instant typing using a password,
once you’ve logged in once, just use your
fingerprint from then on, because we know it’s you. SPEAKER 1: Yeah. It seems like there is a
potentially [INAUDIBLE]. And I’ve always been
frustrated by the whole flat versus skewmorphic
or native versus web. It almost feels like
native web and app web. Is that the new debate? Is this possibly
damaging, again, like another million conference
talks, million videos, million books written
about the patterns? What do you think the
solution is, before we create another scandal? SPEAKER 2: So, I
think a lot of people see native and
web as converging. And a very long time ago I
found this wonderful Greek word chiasmus– the idea that you
have two ideas, and they meet and cross over. So you end up in
a world where apps are much more
hypertextual, and websites are much more app-like. And they cross over. And they borrow features
from each other. So it’s not quite convergence. But I don’t think the
native versus web, or even the app web
versus native web, argument is productive. But I do think looking
at each side, and asking what can we borrow from
them while preserving our own identity. Because if you get progressive
web apps everywhere that will look and
feel like native apps, that isn’t a
victory for the web. Because now you’ve
just find a way to build native apps
using JavaScript. You’ve thrown away URLs. You’ve thrown away
hypertextuality. You’ve thrown away the
value the browsers give you. If you load your progressive
web app full screen, there’s no URL. There’s no way to share. There is no way to browse beyond
the confines of that native app without ending up in a
very confused environment, at which point, couldn’t have
you just used the native app? SPEAKER 1: So, we
have to make sure that the web doesn’t
lose its soul. SPEAKER 2: Yeah. Because there’s no point with
making anything app-like if you use lose your soul. SPEAKER 3: Can you be a
perfectly good developer without designing? Yes. Would you be a more
empathetic developer if you knew more about
design and aesthetics? Yes, I think you would. And I think there’s nothing
wrong with saying that.

12 Comments

  1. Impressive talk. Very centered on web app vs. native app dilema.

    I been working on making native desktops apps for web and just hidding url, links to other sites, etc. I rather just do a native app. I feel compelled to actually do a web site.

  2. Awesome! Currently working on PWA and Ade is god damn right. Thank you for the pwa-directory.appspot.com reference. This show is becoming my favorite youtube show.

  3. Why does it have to be vs tho? so combative.. Designer & Developer
    "..The Youtube App .. Interfaces that expose the functionality" oh no no noo..
    I will never abandon responsive because of a fickle trend shift and I'm not a designer, I'm a programmer by trade..

  4. Very interesting ideas. I especially love the part when Ade is talking about what tools we use for designing and that these tools (like Sketch or Adobe) are still influenced by static medium – paper. That they don't give us the possibilities of responsiveness and designing systems instead of static pictures. Love that and I'm actually working on a tool that's gonna change that, if you are interested, you can check it out here: https://twitter.com/honzavalustik/status/850742132075773953

  5. I loved the way this discussion ended: As designers and developers, we do have to make sure the Web doesn't lose its soul as we progress in the digital age.

    I am concerned day by day that soulless content is taking over ideas and aesthetics.

  6. Brilliant series <3
    I am absolutely thrilled to come across this playlist.

    Loved the discussion Mustafa has started.
    Here they talk about adoptive designs used for web development and not, an original and a staple of web design. So, this means that developers do listen to designers and visa versa and try their best to meet each other's expectations. Yet web needs its own, unique identity and features.
    May be its high time to troubleshoot this idea.
    I agree with Ade when he, so eloquently explained "chiasmus"
    – http://www.dictionary.com/browse/chiasmus
    – https://literarydevices.net/chiasmus/.
    Google it ; )

  7. The bit about RWD becoming "boring" is very historically accurate. I try to use it in all my projects, but over the years I've noticed major companies trying and then bailing a fully responsive production solution.

Leave a Reply

Your email address will not be published.


*