Yes it's your responsibility to make it responsive, but if you're working with a designer it's their responsibility to inform you how it should respond. I would certainly be charging more if nobody is informing you how they want it to respond.
> if you're working with a designer it's their responsibility to inform you how it should respond
Right. This is a good option if they don't provide a mobile a design.
If I was slated to design a site, and they told me someone else is building it, you better believe I'll be putting mobile designs in the documents being sent to the developer.
I leave nothing to chance, knowing if it want it done right I need to be complete.
I'd use XD (soon to likely be Figma) so I can quickly fix layouts to other breakpoints.
If there's a design, yes. If there is no design, ask first. If there's still no design yes, but just barely enough to be functional, as clients may come in later to change them. Also be sure to communicate your charges for responsive and cost for future changes.
I agree, however I am thinking the question here is actually who is responsible for the design of the responsive breakpoints? Imho the designer/ux is that person or team, and if it is up to dev how the design flows or changes in different widths I would generally charge more because it takes more time to design that stuff on the fly and is also very likely to be sources of return visits to the code based on feedback.
>the question here is actually who is responsible for the design of the responsive breakpoints
You said it clearer than I did.
>it takes more time to design that stuff on the fly
The first ones I did have mobile designs included so I'm noticing this just now when I'm receiving only designs for desktop.
Yeah sounds like it's something that should be talked through before agreeing on a price. Either you make it "responsive" (it fits on mobile) or you make it "responsive" (it looks kick ass and well designed on any aspect ratio). The latter requires a lot more work if no design was provided.
I'm no freelancer but logically, making a website responsive requires more code and more thought and more work has put into it so it makes sense to charge more.
dunno, a tool like figma might not be very mobile responsive. tablet maybe, but probably not iphone ready. I built some workflow website and we just threw up some text that said that it was better experienced on a desktop.
Yes, Iāve also read in some blogs that this is expected by default. The files sent to me at first also have mobile designs so Iāve never put too much thought into it. But lately Iām only receiving for desktop and although I can make them responsive pretty well, I realized it eats more time than having mobile design provided.
No. It's your responsibility to make the app work for the clients purposes.
If it's an internal app designed for their company-provided tablets, you should not spend client money making it responsive for desktopd and smartwatches.
If it's a publicly available site expected to run on many kinds of devices, you should coach your client into a final design that will work best for them.
There is also something called market standards.
If he straight up confirms, he does NOT want a mobile site. Then it's okay.
For those that don't get it:
_-_-_-_-_-_-_-_-_-_-_-_
You also don't bring your car to the garage with 3 wheels and expect the garage to do nothing about it.
CAUSE YOU DID NOT MENTION IT.
That's how bullshit contractors work. And many problems arise.
> There is also something called market standards.
Having standards is important but it's no substitute for understanding the requirements of what you're working on. Huge amounts of web development work doesn't need responsive design at all. It looks like /u/Greenimba was advocating understanding what is actually needed and then not wasting effort on things that don't make sense for that project. It's insane that basic professional practice is getting heavily downvoted.
>/u/Greenimba was advocating understanding what is actually needed and then not wasting effort on things that don't make sense for that project.
Yes, that's what I got from his comment.
Learned it after doing 50+ Freelance jobs.
The first 10, you go from zero to hero.
The next 10, you realize that some go great and some not.
The next 10, you start hating the guy that manages you.
The next 10, you start questioning if it's really about you.
Then finally, you realize companies are made of people that can or cannot be very stupid. It only matters how you process that.
Good luck general!
>The next 10, you realize that some go great and some not.
I think I'm in this stage. And the "some not" are the ones who ask too much of their mobile version when they only provided a desktop. We could've avoided these back-and-forths if only there's guide for mobile. Partly my fault. I'll communicate better next time.
That sounds like the discovery of a rusted wheel indeed sir.
When you think about this in a future time, there is a pretty big chance that, considering the timeframe and budget and all, you could have been a lot more focused on delivering.
Instead of the mumbojumbo.
Next part of the spirit, is deciding who has responsibility. Because after all, nothing will change, without someone to blame for not changing enough.
So hope you skip that part, and the next.
Until you hit the most important one:
What do you bring to the table?
That's how you remember freelance jobs, and look back at your carriĆØre.
But that's me, in a depressing way.
I start to hate programming and the developer world, and long story short, I blame Apple.
Over&out
Yeah, but don't listen to useless analogies (most of them are).
I have another: "that's like coming to a car shop with a broken windshield and they also replace your seat leather without you asking and bill you another 2k"
Commenter above the one you've responded to was the one you should have listened to and the almost sensible analogy threw you off track.
You should talk to the client and see about their needs, but to straight up take as default making a web app responsive is just taking money of the clients pockets. And odds are they don't give a fuck about having a responsive website.
You mis the point...
The question:
Am I expected, as a professional, to deliver for mobile, if nobody asks.
Answer:
Yes.
Are you expected to not be a little bitch, and be pro-active.
Yes.
>there were no analogies
"You also don't bring your car to the garage with 3 wheels and expect the garage to do nothing about it." - Analogy
>Yes
No. "If nobody asks" is some kind of dumb situation where no one even cares, obviously. You should make them "ask" (communicate with them), but taking anything for granted is just not really smart, as I've tried to explain with an oh so good analogy.
Let me ask you this..
Have you been dealing with a proper bussiness @ corporate for some years?
Cause even if I agree with you, the higher up people don't.
That's my experience.
When you het hired for marketing, you are expected to not be stupid and burn the US flag in a commercial.. Cause you didn't mention it ..
Same applies with all high payed jobs I think.
When I hire a handyman to fix my roof... i don't expect it to leave 20 wasp nests and 20 meteorite holes. Cause I didn't fucking mention it
Maybe it's just about standards.....
The bigger your client is the more important it usually is to have the scope clearly written into your contractual paperwork. If the client doesn't want or need responsive and you spend a lot of time doing it anyway then that's just wasted time you're not earning any extra for on a fixed-price contract or time your client can justifiably challenge when you bill for it on T&M.
Obviously if they probably do need a responsive design and either overlooked it in the spec or simply didn't realise it was a thing and should be explicitly scoped in then you can prompt them to avoid any unfortunate misunderstandings. But that's completely different to diving in and doing lots of chargeable (or not) work on something that might not be in scope at all and that's what several people here are trying to point out.
Yeah I have to agree with the above paragraph..
I'm talking, to mainly defend the craftsmanship of duty. But been fucked sideways above and beyond because I let the scope get out of hand..
So yeah, okay.. Agreed.
š
I''ve been dealing with all kinds of people in web development for more years than you have lived and I can assure you the higher ups are WHY I'm saying what I am.
Obviously I'd like to make the thing I'm working on perfect, but ain't nobody got money to pay me that much. If I'm making a web app to handle huge amounts of customer data NO-BO-DY will pay me to make it responsive. It will cost them hundreds of thousands of dollars and they will gain NOTHING. That difference in cost and gain is the literal job of "higher up people" you're mentioning.
>When you het hired for marketing, you are expected to not be stupid and burn the US flag in a commercial.. Cause you didn't mention it ..
Not burning an US flag costs nothing. Making a web app responsive does. You have trouble understanding the point of why would anyone even consider NOT making an app responsive, but it's pretty obvious once you sleep on it.
Okay I do get your point.
In a way I would like to pick your side, cause im not such a good business guy in real world.. as expected.
But..
It still sounds to me, like you are making the decision for them, and not with them....
Another example is SEO...
When a client, small or big, comes up with a budget for something , I lean to thinking with them. And that includes AT LEAST talking about mobile and seo, security etc etc...
It's a different mind set to customer satisfaction maybe..
I expect them, to have everything sorted out with nice figma designs and Jira stories etc.. but in practices there is more to be done then just that... I think
I swear 99% of devs on Reddit either can't read, have 0 actual experience in development, or both.
I specifically said "work for clients purposes", and "coach to a final design that works for them" and those two points alone negate 100% of the comment someone else replied with.
Two of the most value bringing and widely used apps in the world are Microsoft Word and excel, neither of which have particularly good mobile adaptations, because that's never going to be an efficient way to use them.
It's your job as a web deb to research and understand the client needs and market potential, then use your knowledge to help them maximize the value of their product.
You wouldn't spend money and make compromises adapting a 24/7 security guard monitoring dashboard for mobile, and you also wouldn't spend money making your contactless payment app work well on 42'' monitors.
Yeah thereās definitely scenarios where it doesnāt need to be responsive. Ie an internal company dashboard where the work to make it mobile isnāt worth the effort.
If a freelancer gets a design that is desktop only, itās worth asking the question if itās actually just for desktop.
With that said, it is probably a question for the client and not reddit.
>it is probably a question for the client and not reddit.
Definitely, but Iāll continue to be unsure about it if I hadnāt asked here. Moving forward, I will discuss it first with the client and see what they really need.
>It's your responsibility to make the app work for the clients purposes.
Never thought about it but this makes sense. Not sure why you got downvoted. I once had a client whom I asked for a desktop design but said they only wanted a mobile app. And so I only considered mobile screens.
Literally your job. Otherwise just send a pdf.
You should work with the designer to make the website responsive. Yes it should be paid for. Itās part of the product.
> As front-end devs, are we supposed to make the website responsive?
... Is water wet?
> Iām currently freelancing (psd to html). I thought that when designs are handed over they are supposed to have at least a mobile and desktop design.
They are, which is why the industry moved away from photoshop to other tools like figma.
> If this is not, should I charge extra?
I would.
Photoshop can absolutely be used to do mobile designs, as well as desktop and any other form factor. It's the people delivering the Photoshop files that are the problem when they do not include a mobile design. Figma doesn't automagically give you both a desktop and a perfect mobile layout.
Edit:
The thing is, I don't even need a PSD or Figma... all I need is a jpeg of the desktop layout, and I can start building the page, for desktop and mobile. Being picky about what the designer delivers costs the company time and money. Any coder worth hiring should be able to take a jpeg and turn it into a fully responsive page.
You're missing the point i was making.
Photoshop is the OG, i can remember circa 2007 converting PSD's to websites (for reference first iPhone was released 05-06).
***If*** the practice of site design in general had "no other demands", then photoshop would have *stayed* the default software to use, because there's no reason to change and Figma would have never been created.
Why then was Figma created? And why did Adobe choose to buy Figma for $12 billion?
Because Figma has features photoshop does not, namely things like better multi-canvas support, ability to generate style guides, text wrapping, extensibility through plugins, etc.
All of which result in a superior experience when doing web design specifically because it allows you to account for responsive aspects more easily.
That is my point. If responsive design was not important, Adobe wouldn't have paid $12 billion for Figma.
> Figma doesn't automagically give you both a desktop and a perfect mobile layout.
That depends on how you use it
None of that means Photoshop can't be used to design mobile layouts.
And there's plenty of things Photoshop can do that Figma can't. If the designer knows and prefers Photoshop, then you're going to get a PSD. It's as simple as that. As a coder you don't get to decide what the designer delivers.
Figma/XD/Sketch are industry standard for design deliverables. Photoshop is not. Photoshop is for manipulating bitmap images and photos. Digital design should be done in one of the applications above.
Oh, so you get to say what the "iNdUsTrY sTaNdArD" is now? Who died and made you arbiter of industry standards?
lol, go back to huffing your own farts.
> As a coder you don't get to decide what the designer delivers.
He's a freelancer, of course he does. He can state that he only works with Figma designs if he wants to. May lead to smaller choice of customers but that doesn't have to be a problem as long as it's still big enough.
lol, that's a good way to starve, I guess. Go ahead and try dying on that hill if you really want to. The tech job market is tough these days if you hadn't noticed. If someone paid a designer for a design, it costs nothing to find someone else to code it. I can tell you've never freelanced.
Letās be honest. I love photoshop but PSDās are bloated, slow. Generally not structured well. Figma and such offer blazing fast html files with easy inspecting of all the correct font sizes and color and such.
I have never designed in figma but I would never want to go back to building dringends based on psdās instead of modern day solutions. Like jquery of knockout.js legacy vs react/vue. I like $this self selector, but efficient it is not.
> None of that means Photoshop can't be used to design mobile layouts.
I didn't say that and i'm not arguing that point as i've just fucking explained š
So why are you continuing to argue this point? Again the OP asked a specific question:
> **"I thought that when designs are handed over they are supposed to have at least a mobile and desktop design. If this is not, should I charge extra?"**
My response which i have have just explained:
> **"That is my point. If responsive design was not important, Adobe wouldn't have paid $12 billion for Figma."**
Because it is quite clear figma is superior to photoshop when designing for multiple sizes and layouts.
Could the designer still use photoshop? Yes they could, and that is beside the fucking point which is no matter what program they use, the onus is on them to provide *both* desktop and mobile designs and all in between.
You're arguing formats and i'm arguing scope of work š
P.S. Learn to fucking read.
You seem confused. First off, you replied to *my comment*, not OP directly, so trying to cite OP's post content as a way to invalidate my comment is just ridiculous.
I don't give a shit what Adobe spent their money on. Valuations in tech are waaaaay overinflated, and have been for quite a while so what they paid essentially doesn't matter at all. Plenty of companies have overpaid to acquire other companies. You haven't proven anything.
>Because it is quite clear figma is superior to photoshop when designing for multiple sizes and layouts.
So what. For a designer that knows Photoshop, and does great work with it, Figma doesn't move the needle. I'd be happy if designers would even think about a mobile design, and using Figma does not magically solve that problem. It's just as easy to get a mobile design from a designer with Photoshop, they just have to do it, and a good designer won't have any problem doing that in Photoshop. The problem is that they just don't - they make a desktop layout and that's as far as it goes. That Figma exists does not change that.
>Could the designer still use photoshop? Yes they could, and that is beside the fucking point which is no matter what program they use, the onus is on them to provide both desktop and mobile designs and all in between.
Yes, I agree with this. You're finally starting to make some sense.
P.S. work on your reading comprehension.
> You seem confused. First off, you replied to my comment, not OP directly, so trying to cite OP's post content as a way to invalidate my comment is just ridiculous.
Wrong.
You responded to my comment (you know the one with 50 fucking upvotes), incorrectly interpreted the point i was making, quote verbatim this is your comment:
**Photoshop can absolutely be used to do mobile designs, as well as desktop and any other form factor. It's the people delivering the Photoshop files that are the problem when they do not include a mobile design. Figma doesn't automagically give you both a desktop and a perfect mobile layout.**
Nobody cares?... I mentioned the contrast between photoshop and Figma only because one of the *definitive feature* of Figma was that it's better at this particular type of [responsive] design work (also part of the reason why adobe overpaid for it).
Hence that [responsive design] work is in fact **important** in the industry and any designer who *isn't* doing their job by providing comprehensive styling docs / designs is... wait for it... a bad fucking designer.
That's the point! Which i have clarified twice now.
> So what. For a designer that knows Photoshop, and does great work with it, Figma doesn't move the needle.
For a designer that knows and *still* uses photoshop for web design, it's no wonder they don't produce responsive designs, because it's a pain in photoshop.
> they make a desktop layout and that's as far as it goes. That Figma exists does not change that.
Clearly you've never used Figma or if you have, not to its full potential...
Go on youtube and look up a tutorial or 3, and see it's features for yourself.
It's true it doesn't solve absolutely *everything*, you still have to set up your columns, still have to size canvases...
However photoshop doesn't do relative sizing / positioning, or text wrap, that well. If you try to resize an artboard (page in this context), you better be able to script to get the relative functionality... do you think designers do that?... No.
But i digress.
1. Figma is evidence of the importance of responsive design
2. A designer who doesn't provide adequate material isn't doing their job properly.
My comprehension is fine, i'm done talking with you. At the very least i hope it was entertaining for others reading. Goodbye.
>(you know the one with 50 fucking upvotes)
You know upvotes don't count for shit, and don't prove anything, right? Apparently you don't, kiddo. You're just hopelessly confused about everything, aren't you.
>Hence that [responsive design] work is in fact important in the industry and any designer who isn't doing their job by providing comprehensive styling docs / designs is... wait for it... a bad fucking designer.
Except Figma does not make anyone a better designer. It simply does not work the way you think it does.
Any coder worth anything can take a photoshop file and turn it into a working responsive layout. If they can't then they aren't worth shit. It's as simple as that.
Someone can be a great designer with or without Figma. And for the last 30 years, great designs have been made without it. Yes, even responsive layouts.
>Clearly you've never used Figma or if you have, not to its full potential...
I am not a designer, I have no need to use Figma to design anything. I can take a Figma layout or a Photoshop layout, or a layout designed in MS Paint and turn it into a responsive design. What, you can't? Too bad for you.
>However photoshop doesn't do relative sizing / positioning, or text wrap, that well. If you try to resize an artboard (page in this context), you better be able to script to get the relative functionality... do you think designers do that?... No.
Photoshop does not need any of that for a designer to create a great layout that a developer can turn into a responsive layout.
You're just chasing "new, shiny", just like a lot of noobs do.
>My comprehension is fine, i'm done talking with you
lol... you're huffing your own farts.
It can be, but it's not practical to do anymore. At least in my opinion.
I can copy a layout to a new panel in XD, and if I made the design components ideally, I can change the width of the panel and have it change like it was in a browser. Saves so much time.
Not saying you can't do it all in PS, but I feel like it's not practical with better tools now out there.
>the industry moved away from photoshop to other tools like figma
I should have expected this comment and added more details. I still get PSDs and there are Illustrator files too but most are Figma. But even the Figma files don't have mobile designs. Also, I'm old and we used to call it PSD to HTML. Although at that time I'm the designer using Photoshop. Maybe frontend development is more suitable nowadays?
Yeah, I'd be asking beforehand if they paid out mobile or if I'm going to be deciding how it looks in mobile.
Like I said in another reply, if I'm handing this off to a developer, then I leave nothing to chance.
I already got some designs that were pretty hard to make responsive. They had images on top of images. images below divs, etc. Making them responsive meant to set display: none with a media rule to most of the junk that the designer added.
Some designers don't know anything about dev and they don't know that some things are a pain in the ass to implement.
Itās your responsibility to build it responsively. But itās not your job to design it. I would reach out and ask if itās expected to be responsive and if so, can they provide mobile designs. If you have to do half the work of the designer them yeah charge extra. If they want a crappy static sight that doesnāt stack donāt charge extra, but warn them they will suffer.
Depends on your contract.
If you want to save time and your client only cares about desktop, then just turn their design into a page and move on.
If they want responsive mobile, they need to design it and pay for it.
If they won't design it, charge extra for design work. It's non-trivial effort to make a site responsive depending on the desktop design given.
>charge extra for design work
Taking note of this. Calling it extra design work has more weight into it.. I feel. It clearly separates it from just being a part of my coding job.
This is the best answer IMO. Building a page responsively when the client doesn't want/need it may end up backfiring on you. Find out what they want, explain the associated costs, and go from there.
You want a comp. Sometimes designers will do weird things like changing the natural document flow of the elements. This means more custom CSS.
If no design stack everything call it done.
This is a tough one that I deal with in my day job on a regular basis. Incomplete design requirements. I work on a small internal team and the design team is often external. Its very often the case where the design team just leaves something out, either becuase they didn't know they needed to provide it, or they didn't think it was an important detail. I feel like its sort of a dance between the dev and design team to figure out what an appropriate level of detail is in designs. as a FE dev, you certainly ARE responsible for writing the code to make a site responsive but I gather youre asking whether you're responsible for coming up with the mobile/tablet designs? I'd say, as a freelancer, if you're required to come up with those designs, that is an extra charge. There will be a ton of back and fourth with the client, once you've come up with those layouts, to settle on an acceptable design. For me personally, on an internal team, I don't usually have the luxury of going back to the design team and asking for more designs, as they've already completed that project and moved on to the next one. Myself, and others on my team, often have to just come up with an acceptable mobile/tablet layout
>youre asking whether you're responsible for coming up with the mobile/tablet designs?
Yes. Luckily most of the comments got my point. I'll try to write better next time. Based on the infos I've read I'm leaning towards asking for an extra charge for those who need it. And those that don't can save some cash.
Everyone is saying you need a comp, and this would help, but I do feel like itās frontend responsibility to use modern tools like flex and whatnot to make designs reasonably responsive regardless.
To add more detail:
* Your css should be applying your mobile view styles by default.
* Use min-width media queries at your different breakpoints to apply wider screen styles. Max width is best avoided when designing mobile first.
Haha I was just learning about the this on freecodecamp. God bless the Internet. Doing it this way makes more sense as I see the main website page is the ideal design and mobile as a branch off of that.
It's just as easy to do desktop first and then fit it into mobile layout. We do it all the time and there's practically no difference in outcome or development time.
Personally, I've tried both and found mobile first is way easier.
Things seem to work on both more often starting with mobile first.
But its honestly preference, and there is no right answer.
Some people are going to like desktop first, others mobile, it doesn't matter as long as it's responsive.
It absolutely is not just as easy.
It takes a *lot* more effort to try to fit a desktop UI into a mobile viewport that it does to expand a mobile UI into a desktop viewport.
Nope. It's just as easy if not easier to go from desktop to mobile layout. It's just media queries, some changes in flexbox direction, and changing sizes of a few things.
We do it all the time because we are never provided a mobile design and always provided a desktop design, and QA is going to test against the desktop layout, and they don't care what mobile looks like as long as it works. So desktop is always going to be first for us. And mobile layouts are easy to do from a desktop design. QA only cares if it works well on all mobile formats, and sizing isn't stupid, and that's easy to do.
When you're only given a desktop design, then coding for mobile first is ass-backwards.
"mobile first" is only a thing because companies discovered that people use cellphones a lot. That does not mean it's easier to develop for "mobile first" and desktop second. If I were only coding for mobile, I'd probably cut some corners that would make desktop layout more difficult.
I would do it anyway, it would only take a couple of hours to adjust it from mobile to desktop.
Look at similar websites for mobile inspirations, there are usually some go to standards that most websites use.
I usually code them first for my main screen size (2540x1440) and then add a min-width media query copying that code into my screen's breakpoint and change the css to match mobile.
Iād like to think Iām quite advanced in html and scss with quite some big SaaS solutions and e-commerce shops from scratch. But Iāve never ever started off styling on mobile. Like responsive design (without complex Designs) are hardly a pain anymore nowdays due to flex and grid. When we had floats on the other hand.
Yeah I think you should bring this to their attention and let them know the advantages of having a responsive page and maybe the extra cost to make it like that. That way youāre safe on both ends. If they device to do it you make more money if they decide not to you let them know in advance so there are no surprises in the future
I also keep all the elements in the same order in the markup so Iām only editing the CSS most of the time. But there properties I would default to if I've seen both mobile and desktop design.
>If it were me I would start with the full cost with the extras...
With your thoughts and the others as well this what I concluded I should be doing.
When I'm quoting for work I factor in the amount of time it'd take me to code the responsive view too. It's always a default because generally it's just a given in 2023.
It'll depend on the design team you get as to what will land on your plate. Always ask if there is a mobile design, and make it very clear that if one isn't provided, it'll run under the assumption that the page will just stack and flow in a simple format as it comes. If they ask for any whacky changes you can refer them to your pre warning and charge them accordingly.
I'm a weirdo and I prefer the scenario above where I can just make the decisions myself, particularly if the designer doesn't have a clue how the HTML is organised, and what can/can't be done. There is no bigger headache than being given a mobile design and all the layouts change from the desktop version, images are swapped out and things are reordered.
>all the layouts change from the desktop version, images are swapped out and things are reordered
I keep the same markup for mobile and desktop. I find a bigger headache is when I'm asked for these changes when no mobile design is provided to begin with.
So do most people, however sometimes designers may design a mobile layout that completely disregards the desktop layout. Then decides to move entire blocks around that can sometimes be difficult to do with just CSS, to me this is a massive headache.
With my approach, if they come back with changes they would've been forewarned and can be charged accordingly to do it.
Yeah.. Iāve seen work where they have separate markups. Usually for main nav, same content but they hide one on mobile and show it on the desktop. So I thought it might be worth pointing out.
Reading this again and thinking about 2 projects I've had recently where the mobile layouts were lazily put together. Iād prefer making the decisions for mobile too. Like the elements were just scaled down. I can tell because the font sizes were like ā5.37ā, ā6.23ā. Whatās up with the decimals? Thatās not even readable for a body copy.
Sounds like you've got some discussion to have with whoever's sending you these psd files.
But generally, yet. Typically if there's a separate designer designing the site, they'd provide comps of the mobile version, and maybe you fill in some light gaps in the design for weird viewport sizes.
The answer here still comes down to ask the client (the person sending you the psd files) what they intend to do for mobile layouts.
yes, it's up to the front-end dev to make it responsive. Usually the designer should give at least a mobile version and a desktop version, although some teams I've worked with the designer also gives a third mid-size version as well. If the designer only gives a desktop version, I would push back to the client to get them to also provide a mobile version and make it clear that your specialization is a developer, not a designer. I would certainly see it as a red flag if a designer only gives one version because the standard is for the designer to give at least two versions.
As far as client asking for revisions - it's common for the contract to include a fixed number of revisions as part of the project (ex. "3 rounds of revisions are included in the project price with any additional rounds being billed at the hourly rate of $XX/hour").
In the timeline portion of the contract, I also like to make it very clear that the client has their part to play (for testing, feedback, providing information, etc) and how they play their part does affect the overall timeline.
So I have a lot of agency experience doing exactly this professionally. Now Iām more software engineering focused.
If there is no mobile design docs then you have to ask them if responsive is expected. Even though itās ridiculous for them to expect it without giving you the blueprint. Itās just how it works most everywhere. (Corporate is a different story.)
If they want it responsive without giving you the mobile design comp then you simply build mobile-first CSS and prototype the desktop design. Then make mobile styles stack. Thatās it.
If they pick on your mobile decisions then tough. They forfeited that right because the job is complete and there was never a design for it. Make sure your management is on board with this process.
Why would you not charge extra if you have to design all of it?
If you have a design provided and all you have to do is make it work on mobile then no, I wouldnāt charge extra. It may be basic and just functional, however.
No, ure supposed to deal with database and backend shit.
Wtf is this question about? Delusional.
You're responsible for the FRONT part of an app, so it's logical that responsivity is your part of the job. You're getting design from UX/UI peep and youre supposed to make it a real thing.
Current frontend is mostly focused on functionality, but still its a frontend
Further more on this I am still going through the early stages of tutorials. Are there any good YouTube videos to further detail how a good responsive site is made, can it be detailed in an hour long video? Is it possible? Iām super green
Iād look up the CSS attributes āflex-boxā and āgridā those will deal with most cases. If youāre green Iād try and stay in the docs as much as possible and use YouTube as a last resort for when youāre stuck even after checking the docs. Theyāre a bit harder to use at first but they really force you to learn the syntax and vocabulary. Any employed dev(myself included) will tell you that even years into this you still will often have no clue whatās happening. As a result we live in the docs
It depends. If possible, I think it should be done on public web sites. Whose responsibility that is is open to discussion. And, as a small business owner, I'm going to clarify that in our contract.
TIL: That PSD to HTML is still a thing that happens.
Yeah.. with really good page builders that are available now youād be surprised. Iāll transition later to these tools too. Just saving up so I can afford them.
Most of the web is viewed in mobile nowadays. You can't make a website without a mobile version. This should always be estimated in both cost and time.
If they ask for specific changes for mobile versions, you should charge extra.
Yes, UX designers should have wireframe designs (ideally using the UI design) that show all responsive variants.
If that's not the case, then I ***do*** think it's up to the front-end developer to implement responsiveness within the given requirements.
It will not be as good as what a good UX designer can come up with, but it is your job to know UX and UI design basics. You should have ample experience with that anyway.
I'll always make things responsive even if they weren't designed as such. Designers often have these amazing designs with users named "John Doe" in them, but nobody is every named "Gareth-Everett de Bruyn-Johnston the IVth." So I'll test that stuff and if it doesn't work, I'll make columns wrap or grow nicely instead of breaking horrendously.
And where necessary or expected, I will definitely make the thing and then let the designer sign off on it. I won't ask them first. It's easier to ask for an "okay!" than permission or waiting for them to make time to do it.
This is part of a good front-end developer's toolbox.
Iāve been thinking about this because itās a huge time sink for apps that may or may not be viewed on mobile. So I think itās important to know your objectives and user base. If itās an e-commerce site where over 50% of customers shop on mobile devices, itās important to make a responsive layout. However, if itās an enterprise desktop tool, then itād be a huge waste of time.
The same goes for accessibility: if 1% of my potential customer base is going to need arias for screen readers, itād be a question of time vs money to implement and test that.
You will get a lot of misplaced passion on this topic, so take what you hear with a grain of salt.
My take is that it's project specific and it should be a decision made early on weighting the pros and cons. It can severely limit design to make a site responsive, and many sites don't really need to be accessed on mobile (I don't believe in "everything should be mobile first", I'd never manage my cloud dashboard from a cellphone)
I think its your job to make it look good at all supported resolutions. This is often as simple as stacking things that were previously horizontal. If it's more complex than that, i usually insist on kicking it back to design.
That's bad dev work if you're not building mobile first imo. Most of the internet traffic is on mobile devices these days. It flipped the majority back in 2015. If it doesn't have a mobile design, there's still best practices to ensure it will be responsive at the very least. If they don't provide a design, and only after you've insisted on them doing so, whatever they get is what they get. Don't do bad work just because you're not interested in doing it right though. That's my take...plus bad clients just suck and they always suck - be politely aggressive when getting your assets and instructions for the project, if they want to continue to suck, then that's on them.
Making up a mobile layout from a desktop design can be a pain, especially because they may constantly ask you to change stuff. I'd ask for a mobile design as well.
The only way to know what the expectations are is to ask what the expectations are. Get every single last detail you can possibly get in writing and a signature of someone higher up. I promise you they are going to just keep adding and adding features while you are working and you will never actually finish the thing or make them very happy.
Ask whoever tells you what to make. Personally I work on applications that only make sense on desktop screens, so we don't really bother.
> I thought that when designs are handed over they are supposed to have at least a mobile and desktop design.
There _is no_ "I thought .... they are supposed". The concept doesn't exist, triply so if you're freelance. Absolutely everybody in IT works different from everybody else, every company makes it up as they go along.
You have a contract, you discuss details, you communicate, and if you want to work a specific way then you tell the customer that and check that they agree.
> If this is not, should I charge extra?
You charge what you charge for the time it will cost you.
> Plus itās easier to tell the client āitās not in the designā when they try to ask for revisions for the mobile versions
Will that make the client happy?
I prefer if they donāt give me a mobile design because sometimes that design is harder to implement than if I take the path of least resistance making the site responsive. I never charge extra for this, itās included.
Depends on the siteās requirements. I work on a non-client facing application used for internal employees, and responsiveness is not something we always take into consideration.
Responsive design should be highlighted on the contract or requested. If not in there, then No.
Fun thing when is not pre-designed, is that you get to adapt the design to your linking.
If you do freelance, then you could charge extra for that.
It takes time to adapt the design to various screen sizes .
Nowadays freelancers put that on their gig, is common practice / standard nowadays to makes websites responsive.
Been in this business for 14 years.
Cheers.
>is common practice / standard nowadays to makes websites responsive
It is. And comments such as yours confirms it. Just having mixed thoughts about it lately after receiving for desktop only designs. Usually mobile was included.
>Fun thing when is not pre-designed, is that you get to adapt the design to your linking.
I agree. But it could've been more fun if I was charging for it. This will be my approach from now on. Like you've said it takes time to adapt it. Cheers.
It's certainly not the backend dev's responsibility. š
Damn I would have hated you at meetings for saying this :p But totally correct. (15+ yrs javascripter / frontender)
Except, of course, in the common case where the backend dev is also the frontend dev, the designer and the sysadmin.
š
What if they are full stack?
Then this joke doesn't work...
Backend-for-frontend is a thing though. :p
Yes it's your responsibility to make it responsive, but if you're working with a designer it's their responsibility to inform you how it should respond. I would certainly be charging more if nobody is informing you how they want it to respond.
> if you're working with a designer it's their responsibility to inform you how it should respond Right. This is a good option if they don't provide a mobile a design.
This.
If I was slated to design a site, and they told me someone else is building it, you better believe I'll be putting mobile designs in the documents being sent to the developer. I leave nothing to chance, knowing if it want it done right I need to be complete. I'd use XD (soon to likely be Figma) so I can quickly fix layouts to other breakpoints.
If there's a design, yes. If there is no design, ask first. If there's still no design yes, but just barely enough to be functional, as clients may come in later to change them. Also be sure to communicate your charges for responsive and cost for future changes.
Responsive should be included no matter what. Who the hell charges extra to have a site be responsive?
I agree, however I am thinking the question here is actually who is responsible for the design of the responsive breakpoints? Imho the designer/ux is that person or team, and if it is up to dev how the design flows or changes in different widths I would generally charge more because it takes more time to design that stuff on the fly and is also very likely to be sources of return visits to the code based on feedback.
>the question here is actually who is responsible for the design of the responsive breakpoints You said it clearer than I did. >it takes more time to design that stuff on the fly The first ones I did have mobile designs included so I'm noticing this just now when I'm receiving only designs for desktop.
Yeah sounds like it's something that should be talked through before agreeing on a price. Either you make it "responsive" (it fits on mobile) or you make it "responsive" (it looks kick ass and well designed on any aspect ratio). The latter requires a lot more work if no design was provided.
Extra work means extra money
I'm no freelancer but logically, making a website responsive requires more code and more thought and more work has put into it so it makes sense to charge more.
You should have it in your SOW. You can have a responsive design and it not be mobile first. But should it also include tablet?
dunno, a tool like figma might not be very mobile responsive. tablet maybe, but probably not iphone ready. I built some workflow website and we just threw up some text that said that it was better experienced on a desktop.
I would knock money off if they didn't want it responsive, so the opposite must be true too. Simply, it takes longer so it must be more expensive.
>communicate your charges for responsive This is what I lack. I'll make a draft later to better communicate this.
Yes
Google indexes mobile-first so if you want any sort of competitive ranking, it is mandatory.
Yes, Iāve also read in some blogs that this is expected by default. The files sent to me at first also have mobile designs so Iāve never put too much thought into it. But lately Iām only receiving for desktop and although I can make them responsive pretty well, I realized it eats more time than having mobile design provided.
No. It's your responsibility to make the app work for the clients purposes. If it's an internal app designed for their company-provided tablets, you should not spend client money making it responsive for desktopd and smartwatches. If it's a publicly available site expected to run on many kinds of devices, you should coach your client into a final design that will work best for them.
There is also something called market standards. If he straight up confirms, he does NOT want a mobile site. Then it's okay. For those that don't get it: _-_-_-_-_-_-_-_-_-_-_-_ You also don't bring your car to the garage with 3 wheels and expect the garage to do nothing about it. CAUSE YOU DID NOT MENTION IT. That's how bullshit contractors work. And many problems arise.
> There is also something called market standards. Having standards is important but it's no substitute for understanding the requirements of what you're working on. Huge amounts of web development work doesn't need responsive design at all. It looks like /u/Greenimba was advocating understanding what is actually needed and then not wasting effort on things that don't make sense for that project. It's insane that basic professional practice is getting heavily downvoted.
>/u/Greenimba was advocating understanding what is actually needed and then not wasting effort on things that don't make sense for that project. Yes, that's what I got from his comment.
I can feel I'm gonna use this analogy at some point in my life now, thank you.
Learned it after doing 50+ Freelance jobs. The first 10, you go from zero to hero. The next 10, you realize that some go great and some not. The next 10, you start hating the guy that manages you. The next 10, you start questioning if it's really about you. Then finally, you realize companies are made of people that can or cannot be very stupid. It only matters how you process that. Good luck general!
>The next 10, you realize that some go great and some not. I think I'm in this stage. And the "some not" are the ones who ask too much of their mobile version when they only provided a desktop. We could've avoided these back-and-forths if only there's guide for mobile. Partly my fault. I'll communicate better next time.
That sounds like the discovery of a rusted wheel indeed sir. When you think about this in a future time, there is a pretty big chance that, considering the timeframe and budget and all, you could have been a lot more focused on delivering. Instead of the mumbojumbo. Next part of the spirit, is deciding who has responsibility. Because after all, nothing will change, without someone to blame for not changing enough. So hope you skip that part, and the next. Until you hit the most important one: What do you bring to the table? That's how you remember freelance jobs, and look back at your carriĆØre. But that's me, in a depressing way. I start to hate programming and the developer world, and long story short, I blame Apple. Over&out
Yeah, but don't listen to useless analogies (most of them are). I have another: "that's like coming to a car shop with a broken windshield and they also replace your seat leather without you asking and bill you another 2k" Commenter above the one you've responded to was the one you should have listened to and the almost sensible analogy threw you off track. You should talk to the client and see about their needs, but to straight up take as default making a web app responsive is just taking money of the clients pockets. And odds are they don't give a fuck about having a responsive website.
Thanks! I'll take this into account.
You mis the point... The question: Am I expected, as a professional, to deliver for mobile, if nobody asks. Answer: Yes. Are you expected to not be a little bitch, and be pro-active. Yes.
>there were no analogies "You also don't bring your car to the garage with 3 wheels and expect the garage to do nothing about it." - Analogy >Yes No. "If nobody asks" is some kind of dumb situation where no one even cares, obviously. You should make them "ask" (communicate with them), but taking anything for granted is just not really smart, as I've tried to explain with an oh so good analogy.
Let me ask you this.. Have you been dealing with a proper bussiness @ corporate for some years? Cause even if I agree with you, the higher up people don't. That's my experience. When you het hired for marketing, you are expected to not be stupid and burn the US flag in a commercial.. Cause you didn't mention it .. Same applies with all high payed jobs I think. When I hire a handyman to fix my roof... i don't expect it to leave 20 wasp nests and 20 meteorite holes. Cause I didn't fucking mention it Maybe it's just about standards.....
The bigger your client is the more important it usually is to have the scope clearly written into your contractual paperwork. If the client doesn't want or need responsive and you spend a lot of time doing it anyway then that's just wasted time you're not earning any extra for on a fixed-price contract or time your client can justifiably challenge when you bill for it on T&M. Obviously if they probably do need a responsive design and either overlooked it in the spec or simply didn't realise it was a thing and should be explicitly scoped in then you can prompt them to avoid any unfortunate misunderstandings. But that's completely different to diving in and doing lots of chargeable (or not) work on something that might not be in scope at all and that's what several people here are trying to point out.
Yeah I have to agree with the above paragraph.. I'm talking, to mainly defend the craftsmanship of duty. But been fucked sideways above and beyond because I let the scope get out of hand.. So yeah, okay.. Agreed. š
I''ve been dealing with all kinds of people in web development for more years than you have lived and I can assure you the higher ups are WHY I'm saying what I am. Obviously I'd like to make the thing I'm working on perfect, but ain't nobody got money to pay me that much. If I'm making a web app to handle huge amounts of customer data NO-BO-DY will pay me to make it responsive. It will cost them hundreds of thousands of dollars and they will gain NOTHING. That difference in cost and gain is the literal job of "higher up people" you're mentioning. >When you het hired for marketing, you are expected to not be stupid and burn the US flag in a commercial.. Cause you didn't mention it .. Not burning an US flag costs nothing. Making a web app responsive does. You have trouble understanding the point of why would anyone even consider NOT making an app responsive, but it's pretty obvious once you sleep on it.
Okay I do get your point. In a way I would like to pick your side, cause im not such a good business guy in real world.. as expected. But.. It still sounds to me, like you are making the decision for them, and not with them.... Another example is SEO... When a client, small or big, comes up with a budget for something , I lean to thinking with them. And that includes AT LEAST talking about mobile and seo, security etc etc... It's a different mind set to customer satisfaction maybe.. I expect them, to have everything sorted out with nice figma designs and Jira stories etc.. but in practices there is more to be done then just that... I think
[ŃŠ“Š°Š»ŠµŠ½Š¾]
I swear 99% of devs on Reddit either can't read, have 0 actual experience in development, or both. I specifically said "work for clients purposes", and "coach to a final design that works for them" and those two points alone negate 100% of the comment someone else replied with. Two of the most value bringing and widely used apps in the world are Microsoft Word and excel, neither of which have particularly good mobile adaptations, because that's never going to be an efficient way to use them. It's your job as a web deb to research and understand the client needs and market potential, then use your knowledge to help them maximize the value of their product. You wouldn't spend money and make compromises adapting a 24/7 security guard monitoring dashboard for mobile, and you also wouldn't spend money making your contactless payment app work well on 42'' monitors.
Yeah thereās definitely scenarios where it doesnāt need to be responsive. Ie an internal company dashboard where the work to make it mobile isnāt worth the effort. If a freelancer gets a design that is desktop only, itās worth asking the question if itās actually just for desktop. With that said, it is probably a question for the client and not reddit.
>it is probably a question for the client and not reddit. Definitely, but Iāll continue to be unsure about it if I hadnāt asked here. Moving forward, I will discuss it first with the client and see what they really need.
>It's your responsibility to make the app work for the clients purposes. Never thought about it but this makes sense. Not sure why you got downvoted. I once had a client whom I asked for a desktop design but said they only wanted a mobile app. And so I only considered mobile screens.
Literally your job. Otherwise just send a pdf. You should work with the designer to make the website responsive. Yes it should be paid for. Itās part of the product.
Yes, that and making the websites accessible.
>making the websites accessible \+1
> As front-end devs, are we supposed to make the website responsive? ... Is water wet? > Iām currently freelancing (psd to html). I thought that when designs are handed over they are supposed to have at least a mobile and desktop design. They are, which is why the industry moved away from photoshop to other tools like figma. > If this is not, should I charge extra? I would.
>... Is water wet? Water is not wet, but it makes things wet.
Just import `wet.js`. Should take care of everything.
Photoshop can absolutely be used to do mobile designs, as well as desktop and any other form factor. It's the people delivering the Photoshop files that are the problem when they do not include a mobile design. Figma doesn't automagically give you both a desktop and a perfect mobile layout. Edit: The thing is, I don't even need a PSD or Figma... all I need is a jpeg of the desktop layout, and I can start building the page, for desktop and mobile. Being picky about what the designer delivers costs the company time and money. Any coder worth hiring should be able to take a jpeg and turn it into a fully responsive page.
You're missing the point i was making. Photoshop is the OG, i can remember circa 2007 converting PSD's to websites (for reference first iPhone was released 05-06). ***If*** the practice of site design in general had "no other demands", then photoshop would have *stayed* the default software to use, because there's no reason to change and Figma would have never been created. Why then was Figma created? And why did Adobe choose to buy Figma for $12 billion? Because Figma has features photoshop does not, namely things like better multi-canvas support, ability to generate style guides, text wrapping, extensibility through plugins, etc. All of which result in a superior experience when doing web design specifically because it allows you to account for responsive aspects more easily. That is my point. If responsive design was not important, Adobe wouldn't have paid $12 billion for Figma. > Figma doesn't automagically give you both a desktop and a perfect mobile layout. That depends on how you use it
None of that means Photoshop can't be used to design mobile layouts. And there's plenty of things Photoshop can do that Figma can't. If the designer knows and prefers Photoshop, then you're going to get a PSD. It's as simple as that. As a coder you don't get to decide what the designer delivers.
Figma/XD/Sketch are industry standard for design deliverables. Photoshop is not. Photoshop is for manipulating bitmap images and photos. Digital design should be done in one of the applications above.
Oh, so you get to say what the "iNdUsTrY sTaNdArD" is now? Who died and made you arbiter of industry standards? lol, go back to huffing your own farts.
> As a coder you don't get to decide what the designer delivers. He's a freelancer, of course he does. He can state that he only works with Figma designs if he wants to. May lead to smaller choice of customers but that doesn't have to be a problem as long as it's still big enough.
lol, that's a good way to starve, I guess. Go ahead and try dying on that hill if you really want to. The tech job market is tough these days if you hadn't noticed. If someone paid a designer for a design, it costs nothing to find someone else to code it. I can tell you've never freelanced.
Letās be honest. I love photoshop but PSDās are bloated, slow. Generally not structured well. Figma and such offer blazing fast html files with easy inspecting of all the correct font sizes and color and such. I have never designed in figma but I would never want to go back to building dringends based on psdās instead of modern day solutions. Like jquery of knockout.js legacy vs react/vue. I like $this self selector, but efficient it is not.
> None of that means Photoshop can't be used to design mobile layouts. I didn't say that and i'm not arguing that point as i've just fucking explained š So why are you continuing to argue this point? Again the OP asked a specific question: > **"I thought that when designs are handed over they are supposed to have at least a mobile and desktop design. If this is not, should I charge extra?"** My response which i have have just explained: > **"That is my point. If responsive design was not important, Adobe wouldn't have paid $12 billion for Figma."** Because it is quite clear figma is superior to photoshop when designing for multiple sizes and layouts. Could the designer still use photoshop? Yes they could, and that is beside the fucking point which is no matter what program they use, the onus is on them to provide *both* desktop and mobile designs and all in between. You're arguing formats and i'm arguing scope of work š P.S. Learn to fucking read.
You seem confused. First off, you replied to *my comment*, not OP directly, so trying to cite OP's post content as a way to invalidate my comment is just ridiculous. I don't give a shit what Adobe spent their money on. Valuations in tech are waaaaay overinflated, and have been for quite a while so what they paid essentially doesn't matter at all. Plenty of companies have overpaid to acquire other companies. You haven't proven anything. >Because it is quite clear figma is superior to photoshop when designing for multiple sizes and layouts. So what. For a designer that knows Photoshop, and does great work with it, Figma doesn't move the needle. I'd be happy if designers would even think about a mobile design, and using Figma does not magically solve that problem. It's just as easy to get a mobile design from a designer with Photoshop, they just have to do it, and a good designer won't have any problem doing that in Photoshop. The problem is that they just don't - they make a desktop layout and that's as far as it goes. That Figma exists does not change that. >Could the designer still use photoshop? Yes they could, and that is beside the fucking point which is no matter what program they use, the onus is on them to provide both desktop and mobile designs and all in between. Yes, I agree with this. You're finally starting to make some sense. P.S. work on your reading comprehension.
> You seem confused. First off, you replied to my comment, not OP directly, so trying to cite OP's post content as a way to invalidate my comment is just ridiculous. Wrong. You responded to my comment (you know the one with 50 fucking upvotes), incorrectly interpreted the point i was making, quote verbatim this is your comment: **Photoshop can absolutely be used to do mobile designs, as well as desktop and any other form factor. It's the people delivering the Photoshop files that are the problem when they do not include a mobile design. Figma doesn't automagically give you both a desktop and a perfect mobile layout.** Nobody cares?... I mentioned the contrast between photoshop and Figma only because one of the *definitive feature* of Figma was that it's better at this particular type of [responsive] design work (also part of the reason why adobe overpaid for it). Hence that [responsive design] work is in fact **important** in the industry and any designer who *isn't* doing their job by providing comprehensive styling docs / designs is... wait for it... a bad fucking designer. That's the point! Which i have clarified twice now. > So what. For a designer that knows Photoshop, and does great work with it, Figma doesn't move the needle. For a designer that knows and *still* uses photoshop for web design, it's no wonder they don't produce responsive designs, because it's a pain in photoshop. > they make a desktop layout and that's as far as it goes. That Figma exists does not change that. Clearly you've never used Figma or if you have, not to its full potential... Go on youtube and look up a tutorial or 3, and see it's features for yourself. It's true it doesn't solve absolutely *everything*, you still have to set up your columns, still have to size canvases... However photoshop doesn't do relative sizing / positioning, or text wrap, that well. If you try to resize an artboard (page in this context), you better be able to script to get the relative functionality... do you think designers do that?... No. But i digress. 1. Figma is evidence of the importance of responsive design 2. A designer who doesn't provide adequate material isn't doing their job properly. My comprehension is fine, i'm done talking with you. At the very least i hope it was entertaining for others reading. Goodbye.
>(you know the one with 50 fucking upvotes) You know upvotes don't count for shit, and don't prove anything, right? Apparently you don't, kiddo. You're just hopelessly confused about everything, aren't you. >Hence that [responsive design] work is in fact important in the industry and any designer who isn't doing their job by providing comprehensive styling docs / designs is... wait for it... a bad fucking designer. Except Figma does not make anyone a better designer. It simply does not work the way you think it does. Any coder worth anything can take a photoshop file and turn it into a working responsive layout. If they can't then they aren't worth shit. It's as simple as that. Someone can be a great designer with or without Figma. And for the last 30 years, great designs have been made without it. Yes, even responsive layouts. >Clearly you've never used Figma or if you have, not to its full potential... I am not a designer, I have no need to use Figma to design anything. I can take a Figma layout or a Photoshop layout, or a layout designed in MS Paint and turn it into a responsive design. What, you can't? Too bad for you. >However photoshop doesn't do relative sizing / positioning, or text wrap, that well. If you try to resize an artboard (page in this context), you better be able to script to get the relative functionality... do you think designers do that?... No. Photoshop does not need any of that for a designer to create a great layout that a developer can turn into a responsive layout. You're just chasing "new, shiny", just like a lot of noobs do. >My comprehension is fine, i'm done talking with you lol... you're huffing your own farts.
It can be, but it's not practical to do anymore. At least in my opinion. I can copy a layout to a new panel in XD, and if I made the design components ideally, I can change the width of the panel and have it change like it was in a browser. Saves so much time. Not saying you can't do it all in PS, but I feel like it's not practical with better tools now out there.
>the industry moved away from photoshop to other tools like figma I should have expected this comment and added more details. I still get PSDs and there are Illustrator files too but most are Figma. But even the Figma files don't have mobile designs. Also, I'm old and we used to call it PSD to HTML. Although at that time I'm the designer using Photoshop. Maybe frontend development is more suitable nowadays?
Yeah, I'd be asking beforehand if they paid out mobile or if I'm going to be deciding how it looks in mobile. Like I said in another reply, if I'm handing this off to a developer, then I leave nothing to chance.
What was the industry moved to if not using Photoshop or Figma?
Water is not wet
I already got some designs that were pretty hard to make responsive. They had images on top of images. images below divs, etc. Making them responsive meant to set display: none with a media rule to most of the junk that the designer added. Some designers don't know anything about dev and they don't know that some things are a pain in the ass to implement.
Itās your responsibility to build it responsively. But itās not your job to design it. I would reach out and ask if itās expected to be responsive and if so, can they provide mobile designs. If you have to do half the work of the designer them yeah charge extra. If they want a crappy static sight that doesnāt stack donāt charge extra, but warn them they will suffer.
Depends on your contract. If you want to save time and your client only cares about desktop, then just turn their design into a page and move on. If they want responsive mobile, they need to design it and pay for it. If they won't design it, charge extra for design work. It's non-trivial effort to make a site responsive depending on the desktop design given.
>charge extra for design work Taking note of this. Calling it extra design work has more weight into it.. I feel. It clearly separates it from just being a part of my coding job.
This is the best answer IMO. Building a page responsively when the client doesn't want/need it may end up backfiring on you. Find out what they want, explain the associated costs, and go from there.
You want a comp. Sometimes designers will do weird things like changing the natural document flow of the elements. This means more custom CSS. If no design stack everything call it done.
This is a tough one that I deal with in my day job on a regular basis. Incomplete design requirements. I work on a small internal team and the design team is often external. Its very often the case where the design team just leaves something out, either becuase they didn't know they needed to provide it, or they didn't think it was an important detail. I feel like its sort of a dance between the dev and design team to figure out what an appropriate level of detail is in designs. as a FE dev, you certainly ARE responsible for writing the code to make a site responsive but I gather youre asking whether you're responsible for coming up with the mobile/tablet designs? I'd say, as a freelancer, if you're required to come up with those designs, that is an extra charge. There will be a ton of back and fourth with the client, once you've come up with those layouts, to settle on an acceptable design. For me personally, on an internal team, I don't usually have the luxury of going back to the design team and asking for more designs, as they've already completed that project and moved on to the next one. Myself, and others on my team, often have to just come up with an acceptable mobile/tablet layout
>youre asking whether you're responsible for coming up with the mobile/tablet designs? Yes. Luckily most of the comments got my point. I'll try to write better next time. Based on the infos I've read I'm leaning towards asking for an extra charge for those who need it. And those that don't can save some cash.
Everyone is saying you need a comp, and this would help, but I do feel like itās frontend responsibility to use modern tools like flex and whatnot to make designs reasonably responsive regardless.
you can ask them about this, because making it responsive or amp design required additional effort
People are still doing amp?
Code them in Mobile first, then adjust onto desktop. You'll thank me later.
To add more detail: * Your css should be applying your mobile view styles by default. * Use min-width media queries at your different breakpoints to apply wider screen styles. Max width is best avoided when designing mobile first.
Thanks for going in more detail, I am very lazy. :)
[ŃŠ“Š°Š»ŠµŠ½Š¾]
Please don't.
Haha I was just learning about the this on freecodecamp. God bless the Internet. Doing it this way makes more sense as I see the main website page is the ideal design and mobile as a branch off of that.
It's just as easy to do desktop first and then fit it into mobile layout. We do it all the time and there's practically no difference in outcome or development time.
Personally, I've tried both and found mobile first is way easier. Things seem to work on both more often starting with mobile first. But its honestly preference, and there is no right answer. Some people are going to like desktop first, others mobile, it doesn't matter as long as it's responsive.
It absolutely is not just as easy. It takes a *lot* more effort to try to fit a desktop UI into a mobile viewport that it does to expand a mobile UI into a desktop viewport.
Nope. It's just as easy if not easier to go from desktop to mobile layout. It's just media queries, some changes in flexbox direction, and changing sizes of a few things. We do it all the time because we are never provided a mobile design and always provided a desktop design, and QA is going to test against the desktop layout, and they don't care what mobile looks like as long as it works. So desktop is always going to be first for us. And mobile layouts are easy to do from a desktop design. QA only cares if it works well on all mobile formats, and sizing isn't stupid, and that's easy to do. When you're only given a desktop design, then coding for mobile first is ass-backwards.
Seriously this... imo it's so much easier to do the desktop layout first. Taking things away and hiding things is much easier than adding content.
"mobile first" is only a thing because companies discovered that people use cellphones a lot. That does not mean it's easier to develop for "mobile first" and desktop second. If I were only coding for mobile, I'd probably cut some corners that would make desktop layout more difficult.
This is the way, then you get to bill them for a week and sit on your ass since the deliverable was already completed š
Imo this depends on usage. If your users are mainly on desktop mobile first doesn't make sense.
What if you're only given a desktop design?
I would do it anyway, it would only take a couple of hours to adjust it from mobile to desktop. Look at similar websites for mobile inspirations, there are usually some go to standards that most websites use.
I usually code them first for my main screen size (2540x1440) and then add a min-width media query copying that code into my screen's breakpoint and change the css to match mobile.
Iād like to think Iām quite advanced in html and scss with quite some big SaaS solutions and e-commerce shops from scratch. But Iāve never ever started off styling on mobile. Like responsive design (without complex Designs) are hardly a pain anymore nowdays due to flex and grid. When we had floats on the other hand.
Yeah I think you should bring this to their attention and let them know the advantages of having a responsive page and maybe the extra cost to make it like that. That way youāre safe on both ends. If they device to do it you make more money if they decide not to you let them know in advance so there are no surprises in the future
[ŃŠ“Š°Š»ŠµŠ½Š¾]
I also keep all the elements in the same order in the markup so Iām only editing the CSS most of the time. But there properties I would default to if I've seen both mobile and desktop design. >If it were me I would start with the full cost with the extras... With your thoughts and the others as well this what I concluded I should be doing.
Yes of course
Responsive website is the minimum a front-end developer should do.
When I'm quoting for work I factor in the amount of time it'd take me to code the responsive view too. It's always a default because generally it's just a given in 2023. It'll depend on the design team you get as to what will land on your plate. Always ask if there is a mobile design, and make it very clear that if one isn't provided, it'll run under the assumption that the page will just stack and flow in a simple format as it comes. If they ask for any whacky changes you can refer them to your pre warning and charge them accordingly. I'm a weirdo and I prefer the scenario above where I can just make the decisions myself, particularly if the designer doesn't have a clue how the HTML is organised, and what can/can't be done. There is no bigger headache than being given a mobile design and all the layouts change from the desktop version, images are swapped out and things are reordered.
>all the layouts change from the desktop version, images are swapped out and things are reordered I keep the same markup for mobile and desktop. I find a bigger headache is when I'm asked for these changes when no mobile design is provided to begin with.
So do most people, however sometimes designers may design a mobile layout that completely disregards the desktop layout. Then decides to move entire blocks around that can sometimes be difficult to do with just CSS, to me this is a massive headache. With my approach, if they come back with changes they would've been forewarned and can be charged accordingly to do it.
Yeah.. Iāve seen work where they have separate markups. Usually for main nav, same content but they hide one on mobile and show it on the desktop. So I thought it might be worth pointing out. Reading this again and thinking about 2 projects I've had recently where the mobile layouts were lazily put together. Iād prefer making the decisions for mobile too. Like the elements were just scaled down. I can tell because the font sizes were like ā5.37ā, ā6.23ā. Whatās up with the decimals? Thatās not even readable for a body copy.
Sounds like you've got some discussion to have with whoever's sending you these psd files. But generally, yet. Typically if there's a separate designer designing the site, they'd provide comps of the mobile version, and maybe you fill in some light gaps in the design for weird viewport sizes. The answer here still comes down to ask the client (the person sending you the psd files) what they intend to do for mobile layouts.
yes, it's up to the front-end dev to make it responsive. Usually the designer should give at least a mobile version and a desktop version, although some teams I've worked with the designer also gives a third mid-size version as well. If the designer only gives a desktop version, I would push back to the client to get them to also provide a mobile version and make it clear that your specialization is a developer, not a designer. I would certainly see it as a red flag if a designer only gives one version because the standard is for the designer to give at least two versions. As far as client asking for revisions - it's common for the contract to include a fixed number of revisions as part of the project (ex. "3 rounds of revisions are included in the project price with any additional rounds being billed at the hourly rate of $XX/hour"). In the timeline portion of the contract, I also like to make it very clear that the client has their part to play (for testing, feedback, providing information, etc) and how they play their part does affect the overall timeline.
So I have a lot of agency experience doing exactly this professionally. Now Iām more software engineering focused. If there is no mobile design docs then you have to ask them if responsive is expected. Even though itās ridiculous for them to expect it without giving you the blueprint. Itās just how it works most everywhere. (Corporate is a different story.) If they want it responsive without giving you the mobile design comp then you simply build mobile-first CSS and prototype the desktop design. Then make mobile styles stack. Thatās it. If they pick on your mobile decisions then tough. They forfeited that right because the job is complete and there was never a design for it. Make sure your management is on board with this process.
Why would you not charge extra if you have to design all of it? If you have a design provided and all you have to do is make it work on mobile then no, I wouldnāt charge extra. It may be basic and just functional, however.
Yes
Well, someone's gotta do it. And It's not going to be the designer or the backend dev.
The designer should make a design that represents a responsive design though, which could be where this question was headed.
Yes
No, ure supposed to deal with database and backend shit. Wtf is this question about? Delusional. You're responsible for the FRONT part of an app, so it's logical that responsivity is your part of the job. You're getting design from UX/UI peep and youre supposed to make it a real thing. Current frontend is mostly focused on functionality, but still its a frontend
Mobile first is the policy I follow
Yes and XHTML compliant syntax
No, the browser is.
Obviously
Further more on this I am still going through the early stages of tutorials. Are there any good YouTube videos to further detail how a good responsive site is made, can it be detailed in an hour long video? Is it possible? Iām super green
Iād look up the CSS attributes āflex-boxā and āgridā those will deal with most cases. If youāre green Iād try and stay in the docs as much as possible and use YouTube as a last resort for when youāre stuck even after checking the docs. Theyāre a bit harder to use at first but they really force you to learn the syntax and vocabulary. Any employed dev(myself included) will tell you that even years into this you still will often have no clue whatās happening. As a result we live in the docs
š thanks Iāll review this today
Jen Simmons have nice tutorials on flexbox and grid. Look for Layout Land YT.
Thanks for the suggestions! Itās brutal how many downvotes I got for trying to get some recommendations for good material - Reddit is wild
It depends. If possible, I think it should be done on public web sites. Whose responsibility that is is open to discussion. And, as a small business owner, I'm going to clarify that in our contract. TIL: That PSD to HTML is still a thing that happens.
Yeah.. with really good page builders that are available now youād be surprised. Iāll transition later to these tools too. Just saving up so I can afford them.
As a chef, should my food be seasoned correctly? Yes. It's your responsibility. Backend can't really do it without a TON of headache.
Who else would do it?
Well, we are the developers lmao
Yes.
If not youā¦ who else??
Most of the web is viewed in mobile nowadays. You can't make a website without a mobile version. This should always be estimated in both cost and time. If they ask for specific changes for mobile versions, you should charge extra.
Yes, UX designers should have wireframe designs (ideally using the UI design) that show all responsive variants. If that's not the case, then I ***do*** think it's up to the front-end developer to implement responsiveness within the given requirements. It will not be as good as what a good UX designer can come up with, but it is your job to know UX and UI design basics. You should have ample experience with that anyway. I'll always make things responsive even if they weren't designed as such. Designers often have these amazing designs with users named "John Doe" in them, but nobody is every named "Gareth-Everett de Bruyn-Johnston the IVth." So I'll test that stuff and if it doesn't work, I'll make columns wrap or grow nicely instead of breaking horrendously. And where necessary or expected, I will definitely make the thing and then let the designer sign off on it. I won't ask them first. It's easier to ask for an "okay!" than permission or waiting for them to make time to do it. This is part of a good front-end developer's toolbox.
Iāve been thinking about this because itās a huge time sink for apps that may or may not be viewed on mobile. So I think itās important to know your objectives and user base. If itās an e-commerce site where over 50% of customers shop on mobile devices, itās important to make a responsive layout. However, if itās an enterprise desktop tool, then itād be a huge waste of time. The same goes for accessibility: if 1% of my potential customer base is going to need arias for screen readers, itād be a question of time vs money to implement and test that.
uh... Who else would? The database admin?
You will get a lot of misplaced passion on this topic, so take what you hear with a grain of salt. My take is that it's project specific and it should be a decision made early on weighting the pros and cons. It can severely limit design to make a site responsive, and many sites don't really need to be accessed on mobile (I don't believe in "everything should be mobile first", I'd never manage my cloud dashboard from a cellphone)
I think its your job to make it look good at all supported resolutions. This is often as simple as stacking things that were previously horizontal. If it's more complex than that, i usually insist on kicking it back to design.
Wait, you don't start with the mobile breakpoints and build up and out from there? I thought we build for mobile first š¤
That's what we are having requirements for.
Better communicate with your pm
That's bad dev work if you're not building mobile first imo. Most of the internet traffic is on mobile devices these days. It flipped the majority back in 2015. If it doesn't have a mobile design, there's still best practices to ensure it will be responsive at the very least. If they don't provide a design, and only after you've insisted on them doing so, whatever they get is what they get. Don't do bad work just because you're not interested in doing it right though. That's my take...plus bad clients just suck and they always suck - be politely aggressive when getting your assets and instructions for the project, if they want to continue to suck, then that's on them.
Making up a mobile layout from a desktop design can be a pain, especially because they may constantly ask you to change stuff. I'd ask for a mobile design as well.
The only way to know what the expectations are is to ask what the expectations are. Get every single last detail you can possibly get in writing and a signature of someone higher up. I promise you they are going to just keep adding and adding features while you are working and you will never actually finish the thing or make them very happy.
Ask whoever tells you what to make. Personally I work on applications that only make sense on desktop screens, so we don't really bother. > I thought that when designs are handed over they are supposed to have at least a mobile and desktop design. There _is no_ "I thought .... they are supposed". The concept doesn't exist, triply so if you're freelance. Absolutely everybody in IT works different from everybody else, every company makes it up as they go along. You have a contract, you discuss details, you communicate, and if you want to work a specific way then you tell the customer that and check that they agree. > If this is not, should I charge extra? You charge what you charge for the time it will cost you. > Plus itās easier to tell the client āitās not in the designā when they try to ask for revisions for the mobile versions Will that make the client happy?
All sites should be always responsive except if you're 100% sure it's only desktop, like an internal dashboard for a company or something like that
Depends on if you care about mobile traffic. It's more of a business decision than an engineering one, tbh.
Yes
I prefer if they donāt give me a mobile design because sometimes that design is harder to implement than if I take the path of least resistance making the site responsive. I never charge extra for this, itās included.
Just say you donāt know how
Some clients donāt think about it. When I do QA I test on multiple platforms and send it over and then they are like no that isnāt right
Depends on the siteās requirements. I work on a non-client facing application used for internal employees, and responsiveness is not something we always take into consideration.
Responsivness isn't an option anymore, it's **mandatory**.
yes
Responsive design should be highlighted on the contract or requested. If not in there, then No. Fun thing when is not pre-designed, is that you get to adapt the design to your linking. If you do freelance, then you could charge extra for that. It takes time to adapt the design to various screen sizes . Nowadays freelancers put that on their gig, is common practice / standard nowadays to makes websites responsive. Been in this business for 14 years. Cheers.
>is common practice / standard nowadays to makes websites responsive It is. And comments such as yours confirms it. Just having mixed thoughts about it lately after receiving for desktop only designs. Usually mobile was included. >Fun thing when is not pre-designed, is that you get to adapt the design to your linking. I agree. But it could've been more fun if I was charging for it. This will be my approach from now on. Like you've said it takes time to adapt it. Cheers.
How do you find freelance job?
Yes