Website Design

[Wilson Tarbuckles]

Hi All,

I've always been, more or less, a hand coder when it comes to creating websites. 

I've seen some videos about making websites in Designer or Publisher.  But all of them leave out how you actually turn the design into code.

Is there something I'm missing?

Have a great day!

 

Thank you!!

 

Wilson

[walt.farrell]

17 minutes ago, Wilson Tarbuckles said:

But all of them leave out how you actually turn the design into code.

Is there something I'm missing?

You don't do that part of it in the Affinity applications; they are not for building websites. They can build objects you can put into the websites you build, but not the sites themselves.

[v_kyr]

27 minutes ago, Wilson Tarbuckles said:

I've always been, more or less, a hand coder when it comes to creating websites.

Which is still the most flexible way! All you usually need is a good text editor or IDE here. - Though there are also a bunch of WYSIWYG tools available.

30 minutes ago, Wilson Tarbuckles said:

I've seen some videos about making websites in Designer or Publisher.  But all of them leave out how you actually turn the design into code.

Well they probably made the UI/UX design with the help of the Affinity tools. Meaning, they sketched/prototyped how things should finally look like. And they probably created the icons, buttons, logos, banners etc. (... so the graphical image parts) with the Affinity tools. - However, the Affinity tools don't export and generate any web based HTML/XML or CSS format code for you, thus you didn't saw in those videos how they finally turned designs into code!

[Wilson Tarbuckles]

Makes perfect sense guys!  Thanks!!!

[All Media Lab]

Hi @Wilson Tarbuckles,

It's also interesting to read this old article:

https://blog.alexdevero.com/html-rapid-prototyping-facts-need-know/#:~:text=and rapid prototyping.-,What is HTML rapid prototyping,to user's problem or need.

and

https://medium.com/@andreas.johansson.dev/do-you-find-yourself-designing-the-same-screen-over-and-over-html-prototyping-may-help-f87d45787e11

and

https://blog.prototypr.io/stop-designing-in-sketch-design-in-the-browser-c102bcdcdbb

 

You can of course make a mock up in Photo or Designer, but I think it makes no sense for web design it simply doubles your work for no particular reason.

A very common way of creating websites nowadays is HTML Prototyping . I use Affinity Photo And Designer aside to create the responsive images, logos etc. and do my HTML prototyping in Bootstrap. Have used Sketch too but it's to much extra work.  

A very good editor for this is https://www.pinegrow.com It spits out: Bootstrap, Tailwind and Foundation or normal HTML websites. You can even export your site to WordPress if needed. It installs a complete Bootstrap or other framework setup in seconds and you can start building your design. It works perfect with Sublime Text, Atom or VS code next to it. SASS is implemented and more. At the end you have your website ready for upload to the server or to show your client how it really is going to look like.

Regards,

David