Meet the Guest

Jose Urbano

Jose Urbano

We do UI/UX design, branding, and Webflow development for tech companies

Listen on

Apple podcast
Google Podcast
Spotify
Sticher

Transcript

[00:00:00] Jonathan:
[00:00:10] Jonathan: Welcome to the Webflowers podcast.
[00:00:13] Jonathan: This week I'm talking with Jose Urbano, who's an agency owner at studio
Salamero. They do UI and UX design branding, and Webflow of development for tech
companies, but first a word of thanks.
[00:00:30] Jonathan: Octopus D O that's octopus dot D O.. Create your visual site map and
interactive flow taking full advantage of drag and drop. Dive deeper with page content blocks
that make your structure simple to design handle and discuss your client can add content to the
site map, ready for you to design new pages. That's octopus dot D O.

[00:00:56] Jonathan: Hey Jose. Welcome to Webflowers.
[00:01:01] Jose: Hello, Jonathan. Thanks for having me. I'm very excited to be here.
[00:01:05] Jonathan: Absolutely pleasure. what's your favorite flower?
[00:01:07] Jose: I hadn't thought about this, actually. My favorite flower is the Lotus flower.
Cause it just reminds me of, my mom who has a tattoo of a Lotus flower for protection, you
know, it's a, it's an, it's an Asian thing. So that is my favorite flower.
[00:01:21] Jonathan: that's fantastic. That's fantastic. And and whereabouts are you now?
[00:01:25] Jose: I'm currently in my office, a studio office in Hong Kong. Yeah. We're based in
Hong Kong.
[00:01:33] Jose: Yes, sir.
[00:01:33] Jonathan: How
[00:01:33] Jonathan: long have you been there?
[00:01:34] Jose: We're we're about to reach like one year of renting this place actually. It's.
Yeah, but I've been, I've been working out of my house before that, and it was just really hard.
So, you know, now we have this space to focus and integrate.
[00:01:49] Jose: Yeah.
[00:01:50] Jonathan: Let's see, actually sort of do you do split up your time then between office
and home?
[00:01:57] Jose: Yes, definitely. I mean, like home's nice. And it's, it's, it's really far away. It's
like in a village in the middle of nowhere, it's far away from the city so that you have some quiet
moments, but then, you know, I have a dog and I have a. So, you know, like two of those that
you kind of, you kind of really like focus intense and densely.
[00:02:15] Jose: So, you know, the is a nice place to take a break from all the relaxation and,
you know and, and really get some deep work going. So, yeah.

[00:02:24] Jose: Good.
[00:02:25] Jonathan: Now you see all I know about Hong Kong is the, is from, from movies and
stuff. so it just looks like it's all city, but you're telling me that there are and countryside there as
well.
[00:02:39] Jose: Oh, for Sure.
[00:02:39] Jose: Yeah. Generally it's not, it's not very it's not very desirable to live there
because, you know, it's just far away from like all the work the companies and the work stuff in
the central business district. But you know, you have to, you have to choose between like living
close by and spending a lot, like a lot of money versus like Versus living far away, remotely and,
you know, spending relatively less.
[00:03:02] Jose: But at the same time, it was just not convenient to go anywhere. It takes me
like I need to catch a cab every time to get to the train station and you know, it's a lot of money
to spend. So that's one of the on CA for sure.
[00:03:16] Jonathan: So tell us a little bit about your, your journey in with my flow. When did,
when did you start and where did you get the bug to, to really get
[00:03:24] Jose: Right. Yeah.
[00:03:26] Jose: I mean I think it just, it just starts with where I began my design journey, really.
I think the first, first few things that I wanted to you know, got me into web design in general is
being at first being able to create a great experience for, for. Users and just figuring out what
problems they have with, you know, interacting with any type of website than just, and just
solving that problem with a better,
[00:03:51] Jose: user experience. It does sound a bit like cliche, but you know, that's one of the,
that's when I first experienced it, I was like, okay, I can, I can see a problem. I can fix it. And
that's why, you know, that draws me towards you know, design at first. And then another thing
that drew me towards web design was like one of my university professors, he says he was
complained to me that he had.
[00:04:11] Jose: Make a website for one of his courses and cost him 20 K Hong Kong dollars,
which is not too much like compared to like other Webflow sites out there. But, you know, as a
university students, you're like, wow, you can earn all this money for just making a web site. I
mean, try not to be so shallow, but you know, that's one of the things that incentivize me to
come to come onto it.
[00:04:32] Jose: And then from there I discovered Ran Segal from Flux.
[00:04:37] Jonathan: Yeah.
[00:04:38] Jose: He was doing his YouTube thing to, you know, introduce a webflow. And I was
like, wow, I can actually make all types of layouts with without having to learn code. And, and I,
and that's why I just started my journey into web flow. And here I am now,
[00:04:52] Jonathan: Okay. So, so you started with, with design.
[00:04:55] Jonathan: You still design before you start building in Webflow?
[00:04:58] Jose: oh, for sure. Yeah, like it's part of my personal practice and we do things here
in the studio. So we always, , we do a lot of branding stuff and, we do a lot of the design work
before the development, it just helps us explore the layouts as

[00:05:12] Jose: flexibly as possible just to be able to try anything and then figuring out how to
put that on to Webflowers next, you know? So it's, yeah,
[00:05:20] Jose: it's just more flexible that way.
[00:05:22] Jonathan: go on dig into that flexibility a bit.
[00:05:24] Jose: Okay. Yeah. So, so how do I say it? I used to work at a design agency. And
one of the things that my boss told me, she is a very, like, she's a, she's a great graphic
designer and she's, she's also a great UI UX designer. And she has a very great sense of art as
a design thing, you know? And she always told me, Jose don't Like, whatever rules, whatever
framework you have learnt in your entire life, just throw them out the window when you're doing
a design for a website, because you know, the canvas is your is your art board.
[00:05:55] Jose: You can really just try to play around as much as possible because you're
trying to provide the best solution for your client right. At the same time. And also explore
yourself as a designer. That just really like opened my mind to what design can actually do.

[00:06:10] Jose: I'm trying to really explore more into types of layouts are possible on Webflow.
[00:06:15] Jose: You know, it just gives such a great like tool to, to do whatever you want and
just create whatever you want. You know? So that's what I mean by flexibility.
[00:06:23] Jonathan: Okay. So on, on Twitter, you've been redesigning company websites, the
homepage,
[00:06:29] Jose: Yes.
[00:06:30] Jonathan: tweeting about that and you've been showing people what you would do.
And you've explained some of the, sort of the mistakes that companies maybe have made on
their homepage.
[00:06:40] Jonathan: so. The problem I've got now is that you're talking about the complete
flexibility of what you could design on one hand. And on the other hand, you're saying, I know
we've, we've got to do things in a particular way. There are rules, or there are things that you
could get wrong. So how do you put those two ideas together?
[00:07:00] Jose: Right. Yeah.
[00:07:00] Jose: so, I mean, I have been doing that redesign challenge as a way to like engage
with the Twitter community. You know, Twitter is pretty awesome. And that's how I got to know
you, Jonathan. When I'm doing the redesign challenge, like I'm trying to like do the design as
quickly as possible so that, you know, it limits me and,
[00:07:17] Jose: I need to find out the fastest way to, you know, express myself creatively. And
most of the things that are quote unquote, wrong on different sites, they're not actually wrong.
It's just what, what I'm trying to improve is how can you make your website standard? Across
the more like millions and millions of other similar looking websites that your competitors might
have.
[00:07:40] Jose: And these are things that like a lot of the times, I I'm still on day nine. I've
been, I've been procrastinating a lot of, as you probably already know, but Yeah. it's just those
minor things that that can do a lot for your, for your website design, you know. There's a lot of
patterns, you know, a lot of patterns that a lot of these websites have like bigger images
different, bigger tech sizes, more color and, and these small things can really make a huge

difference in making your website stand out. I do try to like suggest some crazy layouts and
stuff, but in the end, it's it's about how the company is approachable to their audience.
[00:08:17] Jose: And so you do have to make a balance between going completely artistic on
one hand and like structuring it in a readable way and an accessible way on the other hand, you
know? So there's always that fine line of balance there. So that's what I've explored.
[00:08:32] Jonathan: So, when you got a new client and they want a complete package brand
and website, how do you start? What do you do?
[00:08:40] Jose: Well, I try to look at their industry, like what they do. First. I look at the industry
I look at their competitors and I look at other websites that the first thing I ever do?
[00:08:51] Jose: on all redesigns look. at similar, better looking websites, right? How do they
use color? How do they use like their, their typography?
[00:09:00] Jose: How do they use animations? And I collect a bunch of these websites and, and
put them in and Figma is Figma to design all my stuff. And I just see similarities. And I try to
apply those similarities to a new, to this new redesigned that I'm doing. And I don't, I don't mean
to throw everything.
[00:09:19] Jose: I mean, if the company will allow me to throw everything branding out the
window, then by all means I'll do so, you know, but I try to keep the, I try to keep the clients.
Branding in mind, their colors, their type of feed, their videos, their images. I keep them all in
mind and I try to make it more visually aesthetic so that it's just way more attractive to whoever's
visiting the website.
[00:09:41] Jose: Yeah, and that's how I start.
[00:09:43] Jonathan: Well, give us some clues as to how you make an existing brand more
aesthetic.
[00:09:50] Jose: Right. First off I would, I would say layout is one thing. A lot of times when a lot
of websites out there follow a very, very similar structure in terms of layout and where they place
their images and how they placed the headings and paragraphs and whatnot. It's nice.
[00:10:07] Jose: It's good to have a standard layout. It's how can you change that even more
within your constraints that you're working with? How can you make things a little bit more?
Maybe move the picture a little bit to the left. We'll be like, we'll throw the user off and be like,
oh, this is interesting.
[00:10:22] Jose: You know, like you want to, you want to visually please the user with these
small nuances of, of design, you know, so layout is one thing. Typography is another thing. How
can you really show the contrast between what's important and what's supplementary to that,
you know, that some of that means larger headers you know,
[00:10:41] Jose: The text, the font, weight, and just seeing how you can place that within the
website, you know, , that's another thing.
[00:10:48] Jose: And, I feel like probably the last thing would probably would be colors. Cause I
know, I know companies have colors as they're they have a lot of colors. In their branding, but
they don't know how to use it, like to enhance the visual experience. You know, it can go further
from just using your primary color as a call to action button.
[00:11:09] Jose: You know, you could use your primary as a way to highlight and an entire
section or an entire like

[00:11:14] Jose: video and contrast that with like with white or something , Yeah high contrast .
[00:11:20] Jonathan: Yeah.
[00:11:20] Jonathan: Yeah.
[00:11:20] Jose: Yeah that can definitely, you know, tell the story a lot more visually, as
opposed to just keeping things plain and very easy to approach.
[00:11:28] Jose: I think.
[00:11:28] Jonathan: So once you've got your designs in Figma, Tell us a little bit about the
process of how you'd get it from figure into webflow, how do you work out what's going to be a
section what's going to be, you know, within the section. How are you going to lay that out in, in
Flexbox oh or grid
[00:11:48] Jonathan: those kinds of things?
[00:11:49] Jonathan: How do you make those kinds of decisions from Figma to Webflow
[00:11:53] Jose: sure. I would like to give a shout out to, you know, is, is the great people at
FinSweet for creating the client first framework, you know, the fall,
[00:12:03] Jose: every, every week thing. I love client first, you know? I mean, they, they did a
really great job with it, you know? I mean how do you say before, before I even discovered this
framework, I was really,
[00:12:15] Jose: having like an issue of how I can structure the sections properly. How do I give
like, margins, proper padding? How do I, how do I do all of this, and then FinSweet comes out
with this client first framework and it really, really helped me think about a project very
systematically.
[00:12:31] Jonathan: Yeah.
[00:12:31] Jose: Really use that. Very religiously in my web flow builds nowadays to really bring
my Figma designs to Webflow. yeah, I mean, they're just great to leave these resources out for
the public to use, but essentially whenever I'm designing like a full web, a website.
[00:12:50] Jose: I'm already thinking about, you know, which one's a section, which one's a
component, which one needs to talk with CMS and which one needs to which one needs like,
yeah.
[00:12:59] Jose: just like everything functional wise. I'm thinking within this client first
framework. Yeah.
[00:13:04] Jose: And so whenever, like once I'm, once I'm done with the design, it's really just
easy for me to put it onto Webflow just to design to develop it, you know?
[00:13:12] Jose: So that's how I, how I would bring it. Yeah.
[00:13:15] Jonathan: Yeah. I mean, I've said it before and I'm sure I'll say it again. Is that for
me, that, that phrase from Joe Krug that, you know, we don't have. Sections prebuilt
components and things because every section is different. Every build is different. that really
opened my eyes to, to
[00:13:34] Jose: Hmm.

[00:13:34] Jonathan: thinking about taking anything from Figma or wherever you design and
just go this can be in Webflow and it's really easy and it's really systematic. It just doesn't look
like it when you're looking at it on, on Figma or, or even when you're looking at it on screen once
it's built, but it is all there. And and I find that that has been incredibly liberating. Yeah, Yeah,
yeah,
[00:13:57] Jose: yeah.
[00:13:57] Jose: definitely. Yeah.
[00:13:59] Jose: I just want to like, probably something a bit controversial if you don't mind me
saying that on the podcast. no, but I feel like awhile, client first as a framework is, is, is
providing. All web flow designers and developers to, you know, make some, make things
systematically.
[00:14:19] Jose: I feel like a lot of builds out there. They tend to just stick with what's already
been
[00:14:24] Jose: Yeah.
[00:14:24] Jose: built and just leave it as it is, you know? And then that's, I feel like now that's
becoming the trend, you know, you can look at a web flow builder and be like, Okay.
[00:14:32] Jose: I think this must be built by client first or some framework similar to that, you
know,
[00:14:36] Jose: Yeah. So I just feel like client first gives a great framework as a structure. But I
feel like web flow developers need to think more visually. how, how can you use that framework
to explore how the website looks. Yeah, explore the website looks.
[00:14:51] Jonathan: Yeah. I tend to agree with you that the templates that come out from client
first, they've got some, some interesting bits in, but they are pretty templatey, and if you just
make a quick website fair enough. I really think that what they're for is to help people to learn
the system of what client first is all about, you know, Margins and padding don't ever sit inside of
a heading or any paragraph it's always external to that so that you can, you build up this
framework in that, in that way.
[00:15:25] Jonathan: And I think that's a whole new way of, of learning and understanding. And
I think that's quite difficult thing to, to get your head through I think, I think. In that sense, they're
really useful be able to learn client first, but yeah, once, once you've understood the theory
behind it I'm, I'm all for throwing out the templates and, and just building something quite unique
and quite, quite special.
[00:15:50] Jonathan: Not forgetting that people have to use this thing. They have to be able to
find the menu. have to be able to, know what's happening. mean, I saw a video build other day
and the menu even on desktop was two lines. So not even just the bun. And, I just thought you
can't see it.
[00:16:16] Jonathan: You don't know that it's a menu we use that word affordance that we
have, you know, knowing what to
[00:16:20] Jose: yeah.
[00:16:20] Jonathan: the thing. And that was it. You know, it was, it was fun. worked and lots of
animation stuff, but I kind of worry that you can go to. With making things, however you want
them to be.

[00:16:33] Jonathan: If it's a sort of arty fun website, that's, that's not for a purpose of you know,
selling you something fair enough.
[00:16:40] Jose: I do agree for one thing if I know you use client first it tells me something
already that you're experienced in building Webflowers sites, you know, that's already
established as an indication of experience with the tool, you know, I'm actually looking for
freelancers within Hong Kong.
[00:16:56] Jose: And I look at their build and I see , they've made it in client first, I'm like, wow,
okay. is the guy I need to talk to. You know, because a lot of times, I don't want to see like a
build and inspect their site and see like div block 247 and section 325, you know, I'm like, okay.
[00:17:16] Jose: I need to know, I need to know you're .
[00:17:17] Jose: very good at Webflow. And then that's one of the things that attracts me at the
moment when I'm looking for freelancers. But, what I really want to know as well as can you
think of the box, could you use the framework that you're using and just explore as many ways
to make something, make something crazy For me.
[00:17:39] Jose: and, and I do, I do share your sentiment with artistic websites. Like they can go
a bit out of hand and they don't really care about accessibility or like if people can actually use it
on mobile. but you know, like they, they all have their uses and stuff.
[00:17:53] Jonathan: For a portfolio, you absolutely should have one out of the box, way out of
the box, a website that just, but still can be built properly and effectively in Client first or
whatever. I mean, the other thing I'm looking at now is Edgar Allen's Knockout framework. I
haven't had a chance to actually build with it, but I've been I've been reading some of their stuff.
[00:18:14] Jonathan: It's similar in some way. It goes a bit further in other ways. And I'm, I'm
looking forward to having a play with that, on a build as well. Cause I think it's important that we
don't just get stuck one way of thinking. And, and MatÃas Pitters who I had on the podcast to a
couple of episodes ago.
[00:18:29] Jonathan: He he keeps sort of doing the, kind of the intellectual dev thing and asking
questions about, well, why are we calling a global class and combo class? And is there
something in between and what, you know, how does this work? And it, for me, I think it's all
about, professionalism of Webflow developers and, and I'm very excited, you know. Just the
other day Vlad's talked about the education grants that be coming through this year. And it's
really exciting time to be part of Webflow, because so many things are going to grow from here.
[00:19:04] Jonathan: and so much opportunity. I'm doing some, some content design work for a
large company at the moment. And. we're frequently having meetings with people in the room,
right at the beginning. And this is still talking about content and bits of design. And then they've
got devs in the room, was sitting there doing nothing for an hour
[00:19:23] Jose: Oh,
[00:19:23] Jonathan: of dev time because they've got this old fashioned way of working and
building, they're not going to be using Webflow.
[00:19:30] Jonathan: And I just think that that just wasting so much money.
[00:19:34] Jose: Hmm.
[00:19:35] Jonathan: those marketing pages in Webflowers. It would be so much easier, so
much faster. And then as soon as people need to change things, change the marketing
message, build a new landing page. It's done. It's not, a six week but program to pass this thing

through.
[00:19:53] Jonathan: So yeah, Webflow is, is just beginning. That's that's for sure, even though
it's, you know, seven years old or something now
[00:19:59] Jose: Yeah.
[00:20:00] Jonathan: just beginning to see. Coming to fruition. That professionalism that we're
getting now of people niching down or niching into particular areas of what they're doing what
skill sets they're building. I think that's, I think that's really important. Really helpful.
[00:20:16] Jose: Like, I agree with everything he's saying, we're just about to start this amazing
journey of Webflowers becoming a tool that everyone can build in. And it's cool.
[00:20:24] Jose: That Vlad is spending a lot on community, you know, like, and enabling people
to create communities within Webflowers. Cause you know, I just feel like, I'm going to be
honest, I don't know how to invest money into any company on the stock exchange, but if I had
money to invest, I would probably just invest on Webflow.
[00:20:42] Jose: Cause they're just doing really great job on just great, getting everyone
together and, you know, talk it like like enabling people to live their life. with with their craft, you
know, your Webflowers. mean, I try not to be like a huge fan boy, but I really I'm really happy
about Webflow and how they are.
[00:21:03] Jose: Um, and it's just one of those things that I'm trying to do in Hong Kong as well.
I tweeted a few days back that applied to be a web community leader. I didn't know what that
meant. But I just did. I just wanted to, get everyone together and, learn a little bit about no code
and webflow as a tool within no code and just do just to cool events and get to know people, you
know?
[00:21:26] Jose: And, and because the, the, I have an assumption, like my how I see the space
in Hong Kong, actually the space in Hong Kong locally is everything's done by still done by
WordPress or something along the lines of that. And there are people who use Webflow
occasionally here and there, but no one's really coming out and asking where everyone is.
[00:21:44] Jose: And there are no activities anywhere that celebrate web flow as a tool, you
know? So I'm, I'm always interested. Like I'm a community builder myself. Like I, I do
community, events for dance. So I'm a dancer as well. Yeah,
[00:21:59] Jose: So I hold competitions, I hold events. I hold the workshops and I want to bring
that same energy to the no-code space in, in Hong Kong as well.
[00:22:06] Jose: You know, I just, I just love talking to people, you know, that
[00:22:12] Jonathan: I need to, we need to talk about dance for a minute now. What sort of
dance do you do?
[00:22:17] Jose: Oh How do you say this? I do a dance called locking. it is a, you know,
popping and locking. It's a, a street dance. Done way back in 1970s in the west coast of USA as
if I'm from west coast of USA at the 1970s. No, but it's a very vintage, like dance style and, you
know, it came before hip hop and break dance yeah, the, I do that here.
[00:22:41] Jose: I don't show it off on Twitter very much, but on my Instagram I post a lot of
videos. So I try to keep, I don't know why I try to keep that separate.
[00:22:49] Jonathan: Well, we're going to be putting it in the show notes. So I'm afraid it's, it's
no longer separate, but that's, that's, that's the way it goes right now. I just want to your thoughts

about Hong Kong community. I mean, in the days of, of the world being very small, what's the
advantage do you think of having a Hong Kong workflow meetup or group surely anybody can
join anything?
[00:23:13] Jose: Definitely. just feel like, okay. So one of the things that I personally feel of
Hong Kong as a region itself is that most communities are divided by language. You know, you
have English communities over here and the Chinese community over here, it could be dance
community is the same thing, right?
[00:23:31] Jose: And I feel like, no code and web flow and design in general, like, is a language
barrier if we, managed to get everyone unified, like both the English community and the Chinese
community, get them unified, get them brainstorming. You know, there's going to be a lot of
cultural breakthroughs.
[00:23:49] Jose: There's going to be like cultural differences, but it's going to lead to more,
better ideas, better innovation, better breakthroughs. And I just feel like, you know I mean it's a
long-term thing, there's a lot of like definitely language barriers is a really hard thing to hard
thing to tackle.
[00:24:04] Jose: I just feel like the end result will be really rewarding. And then Hong Kong will
be known as like, I hope Hong Kong as a no-code community will, will be seen as something
very, very unique if we managed to solve this problem. So
[00:24:18] Jonathan: yeah.
[00:24:19] Jose: I think.
[00:24:20] Jonathan: Okay. Okay. I mean, yeah, it's certainly an interesting cultural place.
That's that's for sure. Interesting. Right. We're gonna have to wrap it up there, I think. Thank you
so much for your time, Jose. It's been absolutely wonderful. And yeah, we were looking forward
to mostly to seeing your your Instagram locking dance? I mean, I, I've never heard of it and I
was around in the seventies, so I should have, I should have done, but I missed it all. All right.
Fantastic talking to you, Jose. We will speak to you very soon. Bye-bye now.
[00:24:50] Jose: Bye-bye thank you.
[00:24:51] Jonathan: That was great.
[00:25:08] Jose: wow, man. Okay. Wow. Let me, let me stand up and walk around and
[00:25:13] Jonathan: I tell you the best thing I ever did for my birthday. Last Sunday, I bought
myself a standing desk, so well, it's a rising as an elevating desk.
[00:25:23] Jose: wow.
[00:25:23] Jonathan: it's amazing. So when I'm talking, when I'm doing meetings or stuff, it's
always up. And, but it, because it's electric, it goes up and down in seconds. And yesterday I
just had to crack out a load of content and I did Pomodora for 25 minutes, five minute break,
[00:25:44] Jose: Yes.
[00:25:45] Jonathan: 25 minutes standing 25 minutes sitting, standing, sitting, standing sitting
got
[00:25:49] Jonathan: so many words out

Listeners' Questions

No items found.

Ask A Question

If you have anything to ask, let me know

THAnks to

Build your website structure in real-time using our
Content Brick Method and rapidly share it to
collaborate with your team or clients.
Start prototyping websites or apps instantly.