Jump to content

Recommended Posts

I think that every HTML & CSS coder will buy your Affinity Designer and stop using expensive Photoshop :-)

 

Professional web designers/developers don’t use Photoshop to design websites in the first place.

Share this post


Link to post
Share on other sites

Wanna drop my +1 here too.

 

Just saying, a feature to generate code is not just to make developers' job easier, specially because in a full development team devs don't usually make the UI designs. It would in this case connect teams, creating a shorter path and improving consistency between designers and frontend developers, saving a lot of time (therefore $).

 

I think it would be a gamechanger and convince companies to try moving from Sketch to AD.

Share this post


Link to post
Share on other sites

Just saying, a feature to generate code is not just to make developers' job easier, specially because in a full development team devs don't usually make the UI designs. It would in this case connect teams, creating a shorter path and improving consistency between designers and frontend developers, saving a lot of time (therefore $).

Your premise is wrong, though. First of all, CSS does nothing without HTML, so you need to export HTML, too. And the point of HTML is primarily to give content a certain meaning (see https://en.wikipedia.org/wiki/Semantic_HTML)The problem we have now is that no graphics application (or WYSIWYG editor) can know the meaning of an object someone “drew” on a canvas. So, the best that application can do is throw up a lot of divs and a lot of bloated junk code in general.

 

Therefore, it doesn’t make the jobs of any developer, who takes their profession seriously and has at least basic work ethics, any easier; they would have to rewrite the bloat properly anyway. HTML/CSS export could at best serve prototyping (a way Fireworks went, for example) but would never be suited for production environments.

Share this post


Link to post
Share on other sites

Your premise is wrong, though. First of all, CSS does nothing without HTML, so you need to export HTML, too. And the point of HTML is primarily to give content a certain meaning (see https://en.wikipedia.org/wiki/Semantic_HTML)The problem we have now is that no graphics application (or WYSIWYG editor) can know the meaning of an object someone “drew” on a canvas. So, the best that application can do is throw up a lot of divs and a lot of bloated junk code in general. Therefore, it doesn’t make the jobs of any developer, who takes their profession seriously and has at least basic work ethics, any easier; they would have to rewrite the bloat properly anyway. HTML/CSS export could at best serve prototyping (a way Fireworks went, for example) but would never be suited for production environments.

Guys, if i can ease the tension a little, for those interested in a WYSIWYG app, you might wanna pay attention to the developments in Scarlet Macaw: http://scarlet.macaw.co

Serif is not focusing on this for now, they are limited in size and resources should go to more important issues, like coming up with a robust perspective tool in A.Designer for example. I hope they're listening. It kills me that Carapace (http://www.warrenmarshall.biz/carapace/) can do it and Designer needs to play catch up!

 

I also happen to think that if you want to be good web designer, go learn front-end too. Don't be lazy! I'm doing that now. And i'm only getting started.

Those intimidated/confused by floats/clear for e.g. in CSS, there's a better alternative by learning flexbox! There are so many paths to learning ya!

 

Hope i make sense.

Share this post


Link to post
Share on other sites

Guys, if i can ease the tension a little, for those interested in a WYSIWYG app, you might wanna pay attention to the developments in Scarlet Macaw: http://scarlet.macaw.co

 

 

That actually looks pretty neat, I can totally see myself using it, or using it in combination with AD, thanks for the link :) Let's just hope that the PC version won't come too long after the Mac one.

Share this post


Link to post
Share on other sites

Hype is another interesting HTML animation software: http://tumult.com/hype/pro/

 

Guys, if i can ease the tension a little, for those interested in a WYSIWYG app, you might wanna pay attention to the developments in Scarlet Macaw: http://scarlet.macaw.co

Serif is not focusing on this for now, they are limited in size and resources should go to more important issues, like coming up with a robust perspective tool in A.Designer for example. I hope they're listening. It kills me that Carapace (http://www.warrenmarshall.biz/carapace/) can do it and Designer needs to play catch up!

 

I also happen to think that if you want to be good web designer, go learn front-end too. Don't be lazy! I'm doing that now. And i'm only getting started.

Those intimidated/confused by floats/clear for e.g. in CSS, there's a better alternative by learning flexbox! There are so many paths to learning ya!

 

Hope i make sense.

 

SMA, Macaw has been abandoned. No work/progress has been made on it in years. Macaw was developed by a group of kids that gave everyone a lot of hype and promise and then under delivered and then sold the company to InVision, which has done nothing with it.

I would avoid Macaw like the plague. I like InVision, but it's too late for anything good to come of Macaw.

If you are looking for something like it, then Webflow is your best bet.

Share this post


Link to post
Share on other sites

I get that it would take a lot of work to build a fully featured HTML/CSS exporter, and I understand VIPStephan's comment about CSS having no meaning without HTML. But some HTML tags like p, H1, H2, etc are used pretty universally. AD already has character styles - couldn't these be converted to CSS code fairly easily?

Share this post


Link to post
Share on other sites

I get that it would take a lot of work to build a fully featured HTML/CSS exporter, and I understand VIPStephan's comment about CSS having no meaning without HTML. But some HTML tags like p, H1, H2, etc are used pretty universally. AD already has character styles - couldn't these be converted to CSS code fairly easily?

AD will be one heck of an app should they implement this CSS feature. I really hope they are llistening to this and planning for implementation sometime in the near future.

Share this post


Link to post
Share on other sites

What are you wanted to be exported/imported via CSS?

At the very least, I would just like it for the ability to copy the basic style (font, color, stroke, fill) from without having to retype it in CSS or the other way around.

Share this post


Link to post
Share on other sites

I like the current 1.6 beta of the Designer app. I drew a website design in it and now I want to code it.

 

But I feel like back in the old days of Photoshop, when I need to ques every dimension, unit (pt to px conversion), color, gradient etc, by hand.

 

Current and most used apps for web/UI design have a decent way of CSS properties export, which provides clear definition of a designer intentions. Just look at Sketch, Photoshop, Avocode etc. they all have it, because it's a must for using a design further in a development chain.

 

Please Affinity, consider this feature (or API for it), if you're serious about targeting Designer for the UI design area. Thanks.

Share this post


Link to post
Share on other sites

I agree, this is a much needed feature. In order to have simple effects like a hover effect, I need to painstakingly target every element individually in my code. Its just not a very good way to design.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×

Important Information

These are the Terms of Use you will be asked to agree to if you join the forum. | Privacy Policy | Guidelines | We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.