Generate all Webflow assets at once with Birdhouse Templates

Community resources Show & Tell
1

Hi everyone,

I designed a set of Photoshop, Illustrator, Sketch, Adobe Xd and Affinity Designer templates for generating useful assets for your Webflow projects.

700×555 52.7 KB

Use those templates to design the assets that you need to produce to deliver the most complete and fine tuned website. All templates provide well named artboards for export convenience, as well as icons as Symbols / Smart Objects and global colors when available.

There’s a website where you can find details about the templates, and the direct links to the files.

Here’s the page of the project: https://webflow.com/website/Birdhouse-Webflow-Assets-Template

I’m using Github to host the files: GitHub - vincent-bidaux/Birdhouse-Webflow-assets-templates: A set of Photoshop, Illustrator Sketch and Affinity Designer templates to generate useful assets for your Webflow projects.

It’s currently in beta, I’ll make the Github better but I’m currently learning how to control the branch. The most advanced template is the Adobe Illustrator one. There are many things I have to improve for the Sketch and Affinity Designer ones. Feel free to send me any feedback about the templates, especially on the Sketch and Affinity versions.

16 Likes
2

This is great, thanks @vincent :+1:

1 Like
3

And with Affinity Designer version too, brilliant! Merci! :clap:

1 Like
4

@Pasint if you’re skilled with Affinity designer you can maybe help me to make it better. I wasn’t yet able to make the icon as a symbol and control the size and color of one particular ocurrence as I do on the Illustrator and Photoshop templates. I’d take any advice to make it better. For those templates, I like to keep only one symbol for the icon and have all the colors as global colors, so the edition of the assets is possibly super quick. Also, any advice on the setup regarding the preparation of the asset export (naming etc) is welcome.

5

@vincent I’m brand new to Affinity Designer. I’m using this in place of Photoshop as it feels almost as powerful but is sooo much cheaper. Anyway, I’ll give it a go and see if I can help you out with that.

6

Definitely a great app for anyone not having a Creative Cloud subscription. I have a CC sub but I bought Affinity Designer and Affinity Photo anyway.

1 Like
7

Vincent, can you export the Illustrator file as EPS?
I only have Illustrator CS6 at work, and can’t open it :sweat_smile:

I also got a template Illustrator file with other measurements if you want to use.
It’s not all web related, since I also do Print/Production, but still has Facebook, Twitter and other social media sizes :slight_smile:

8

Hey sure, here are two legacy files, one eps and one .AI for CS6.

http://vincent.polenordstudio.fr/snap/Birdhouse__Webflow_Assets_template_0.91b_legacy.eps
http://vincent.polenordstudio.fr/snap/Birdhouse__Webflow_Assets_template_0.91b_legacy.ai

Oh I think I have tons of them, including my own :smiley: For the birdhouse templates I wanted to stick to what’s useful to Webflow sites. There are tons of great social templates and apps around made by great pros :slight_smile:

I’m interested in anything very related to Webflow for the birdhouse tpls.

1 Like
9

Thanks @vincent I was able to open it now :slight_smile:

Always happy to get your freebies :smile:

10

Awesome @vincent, have you tried designer.io? Its great for anyone on a budget as its completely FREEEE and they are keeping it that way, powerful too :slight_smile:

1 Like
11

Awesome stuff! Really cool that you’ve included Affinity Designer, and also awesome that you’ve incorporated symbols in Ilustrator and even included a small tutorial for the new artboard export feature. (Which, FINALLY, amirite?)

Really nice presentation, too! This is awesome!

12

This is pretty powerful, thanks for the heads up! Might recommend to some students that I work with.

1 Like
15

Oh yeah :slight_smile: And there’s more to come, v2 of the template is coming in a few weeks. This is the one oof my template I personally use the most!

1 Like