Affinity Photo - Mock-Up's with Smart Objects

Being a web designer is more than just being able to build a website with WordPress or code one with HTML & Javascript.
To be considered a designer in 2020 you need graphic design skills!
In this Design Masterclass I'll show you how to take the newly added Smart Objects capabilities in Affinity Photo and work with mock-ups.
Create amazing images for your web design projects with tools like Affinity Photo, Adobe Photoshop and other amazing image editing tools.
Affinity Photo: affinity.serif...
Take your WordPress website and skills to the next level!
► THE TOOLS I LOVE ◄
If you like what we do and would like to support us, please consider using these affiliate links when purchasing any of the plugins covered in our tutorials. Thank you for your support.
► WORDPRESS VISUAL PAGE BUILDERS ◄
★ ELEMENTOR PRO: jo.my/1s0t2s2
★ Brizy Pro: bit.ly/2Ji97r8
★ WPBakery Page Builder (Formerly VISUAL COMPOSER): bit.ly/2NVbVNP
★ DIVI 3 Page Builder: bit.ly/2HiiDcE
► WORDPRESS THEMES ◄
★ GeneratePress Premium: bit.ly/2Ydn1SE
★ OCEANWP: bit.ly/2fRHBr0
★ DIVI Theme: bit.ly/2G8JMiA
★ Astra Pro: bit.ly/2zruoKn
► WORDPRESS TOOLS ◄
★ SMART SLIDER 3: bit.ly/2G0G1vB
★ CSSHERO: bit.ly/2qbrRl6
★ SLIDER REVOLUTION 6 - jo.my/sr6
► SUBSCRIBE ◄
bit.ly/2rX7rhu
► LETS CONNECT: ◄
/ wptutz
SUPPORT: Our website offers additional information and perks. Please check it out! wptuts.co.uk

[@rocketgrowthstrategiesdigi4535]

Yes, I’m dumping Adobe and their subscription model. Affinity Photo, Designer, and Publisher. Talk about time savers, you can use tools from one app directly from inside the others. So if your in Affinity Photo and you need to use a tool found in Designer, you don’t have to open Designer you can use the tool directly from inside Photo. What a time saver!

[@WPTuts]

I love the ability to immediately swap between apps. So smooth and not laggy like the Adobe tools. Sadly, I still require an Adobe subscription for a lot of the work I do, but hopefully one day I can drop that in favour of alternatives like Affinity.

[@kevinroberts3789]

Thanks Paul! I've been using the full suite of Affinity tools for a couple years (abandoning Adobe) but there is still much I don't know. I love short tutorials like this that let me quickly file away another skill in my toolbox. Very useful.

[@WPTuts]

Great to hear that you support Affinity and that you find these tutorials useful :0)

[@EternalWorddotorg]

Excellent tutorial, Affinity Photo and Affinity Designer are a must to have for a real web designer, i hope more of these tutorials are coming up! God bless

[@WPTuts]

They will certainly form parts of future tutorials. :)

[@shakuf-plumbing]

Would love to see more about affinity photo and affinity designer. Thank you Paul your videos are amazing and I learned a lot from you :)

[@emmasturgess8408]

Definitely more affinity tutorials I found this very easy to follow and not over whelming like most tutorials, not too fast either and you have a very good lecture voice.

[@PswACC]

I was wondering why the photoshop smart object was not being imported by default. Great thing you put this video together.

[@dazman88]

Couldn't understand why I couldn't open up smart objects. Thank you for once again solving my problem!

[@manamedia]

Definitely Paul, well worth exploring to showcase what is possible, and what is not, with the Affinity Suite in comparison to Photoshop and Illustrator. We switched to Affinity Suite 1 year ago as we could not justify the cost of Adobe Products (after using them for 20 years). Although Affinity has its limitations, by comparison to the Adobe Suite, it is a strong contender to almost match it tool for tool. For example, in Illustrator you have the Blend Shape/Path Tool, where as in Affinity Designer - there is none...yet etc. There are work arounds for most of what is missing in the Affinity Suite, and its worth the investment from a Web Developer/Designer point of view.

[@rojonesdesign]

Very useful information! I want to quit Adobe and their fees in my self-taught journey so learning Affinity on KZbin is what I need. Thank you!

[@WPTuts]

I cancelled my Adobe account a couple of months back and don't regret it at all. 🤘

[@CvS7351]

Adobe exchanged for Affinity two years ago. A great saving for the wallet. For the work Adobe not missed a moment. Perfect for the web and creating folders for customers. Now only an Adobe Video editing replacement by Affinity.

[@audiobirdi]

Checkout DaVinci Resolve or Hitfilm Express for good free replacements to Premiere Pro! I do hope Affinity make a WYSIWYG type web dev app in future!

[@spirit3soul]

Game Changer for me. Just crossed over to Affinity 2.0. Thanks! You have the BEST tutorials and info. Appreciate You!

[@tomasmartincok]

Great video I would like to see more of these. In my work I always need to do some tweaks in images or graphic templates.

[@mdazhardware]

Thanks Paul for this video which is helpful at least for me, just go a head you're in the right path, and thanks a lot.

[@anjaylo]

Thank you very much! Really good explained in only a few minutes :D

Thank you very much for sharing this useful information. It is exactly the feature I need.

[@richarddirksen4501]

Thanks for the video Paul. A series of tutorials about Affinity? Just recently I've changed from Serif to Affinity but haven't had the time to really dive into it. So I would love to see this from you!

[@WPTuts]

I'll certainly be doing more content on these types of tools for various different web design orientated tasks Richard. 👍

[@soyalitaaah]

Saved me from a huge headache! Thank you!!

[@eroticwritergirl]

Thank you so much for this! I dumped Photoshop over a year ago and this is the only feature I've really been missing. I'm so happy I can now do it again. YEA!

[@donnytheflow]

Game! Changer! Super appreciate your sharing of this info. Cheers!

[@rocknets]

I wish Affinity Photo would improve their smart objects functionality. The main issue is that the imported obects are rasterized, which has a number of limitations of what can be edited. e,g templates for mugs. In photoshop you can create a template that will wrap an image around a mug and then swap images for others and apply them to the mug. I'm a fan of Affinity Photo but really wish they would consider the bread an butter tasks that people in the industry have to perform. It would be great if I could copy a warp from one image to another for instance.

[@nazshak]

2 years ago you wrote this comment and Serif made exactly 0 improvements to smart objects funcionality since then :)

[@darrenbivings4227]

Great tutorial ! And Yes to every question you asked. And Thank You!

[@ChrisInk.Fineart]

Grateful for your video about this topic! Easy explained so i can finally use it😊

[@canardgrognon4373]

I have a question about the mock up method. After trying to perform the technique, none of the smart images ever work. Extra layers never appears. How to do?

[@StevanOvich61]

Thanks for showing how to enable this feature Paul. Haven't had chance to play with the software yet! By the way, what is the mouse you have with the myriad of buttons on?

[@WPTuts]

It's a ShuttlePro v2 for video editing. :0)

[@JohnsMoransDog]

Exactly what I was looking for!

[@ArtsyLadyCrafter]

Thanks so much! Easy to follow. Perfect presentation!

[@VishnuAttiappan]

You are awesome! Thank you!

[@TheMonobaby]

Excellent tutorial

[@SuperFilip2012]

Definitely would like to see more videos like this 👍

[@alperenozkan]

Hi Paul Charlton , these kind of videos are helpful than you think. Because you have a WordPress development aspect and only design tutorials are not helpful for us. We need to combine our design skills with WordPress development. So please keep going and share your web design skills, tools and what we can do to create better web designs. Also affinity is a great choice to start. Thanks a lot 👍🏻

[@WPTuts]

That's the track I was thinking of going down. Lots of tutorials on the tools, but not always on the web design aspect. So, you can certainly expect more crossover tutorials in the future. :0)

[@alperenozkan]

WPTuts I have affinity photo and after you started these tutorials, I bought affinity designer yesterday night :)) please keep going ...

[@WPTuts]

@@alperenozkan Affinity Publisher is also very good. If you don't need some of the more advanced inDesign tools, it is a perfect alternative.

[@alperenozkan]

WPTuts ok 👌 then I will buy it too. There is 50% sale right now. edit: I bought it:)

[@WPTuts]

@@alperenozkannice! A very powerful suite of tools for about the same as 1 month of Adobe CC. ;)

[@jonatanyair]

It's 2024 and this tutorial is useful.

[@anaaguilar4016]

Thought this feature was not available, thank you so much!

[@AnnaRosaEverythingEnergy]

Thank you for this video. I would like to know how to tip and tilt a Business card or Wedding invite image in a mock up. I don't have the vocabulary yet :)

[@jeffcarricoguitar]

How to duplicate the smart object and be able to edit each independently?

[@observant_sound]

Can I only import smart objects from photoshop or can I make my own smart objects with affinity photo?

[@renaldfranley2258]

very clear video. I would like to learn how to put a design on a mockup blanket/bedcover

[@ZenfulLifeTV]

Is there a way to create a bulk mock up in affinity? For example different designs on the same mock up template? Photoshop has plugins and scripts that can be used to automate this, but i cant seem to find anything on affinity 😢

[@tammyhodges4447]

Is there a way to do this when it says pixel and not embedded? The file I have says it's a smart object, but with no arrow for sub items.

[@divyrajsinhsolanki427]

hey, i ve been using psd mockups in affinity after successful execution, when i try to export that file in jpeg or png, it gets wierd white coloured perspective lines which ruins the whole mockup please help.

[@vanessaa.7335]

Great video. Thank you so much.

[@bea492g7]

Thank you so much for this and for the two different methods. Most only give the method to going to the layer and for some reason it has not been working for me. Method one works beautifully. You have a new subscriber! Thank you! Questions : Can you tell me, on the export window, what is the difference between exporting a selection area or a selection only area. And also, what are the two differences if you tick the box that says don’t export layers hidden by export persona? When and where would you use this option?

[@jaykingman641]

This is great thanks for sharing this, is it possible to do this on the iPad version yet?

[@coreykretsinger]

Affinity is top notch. That said... I may need to quit watching your videos. Don't get me wrong, the videos are excellent, but wow do you give me a serious case of hardware envy. Guessing you also work with DAW's, judging by your speakers and audio interface?

[@WPTuts]

Lol, sorry Corey... yes, I do have a bit of a thing for home recording. ;0)

[@juliebeth4493]

I can get some .PSD with smart objects to work, but I have come across ones that don't have an embedded object, but only say "double-click" here. When I do nothing happens. Do you have a fix for these type of files?

[@thetruthandnothingbutthetr6484]

Did you listen to the video ? He clearly said not all smart objects will work

but there some certain things like curve, it doesnt fit in affinity photo. when i open photoshop it fit like normal ,

[@WPTuts]

I agree, it's not a perfect solution. At least you're not tied into a subscription model with Affinity though. 😉

[@badcatdesign]

Yes! good grief... who knows why they didn't ship the update with this pref turned on.

[@WPTuts]

I know, right!

[@franci-uz]

How can I create a smart object from scratch? No clue how it's called in affinity photo UI

[@franci-uz]

1 year later.. No answer.. I got a smart object, which I duplicated. I replaced the contained picture. The 2 smart objects changed. They lookk the same. But I want to look them different, so I would have 2 different pictures. But it behaves like a clone. How can I "unlink" the smart object from the other? Thank you!

[@maliktanveerdhool]

Hello Paul sir; I got an order and unfortunately facing an issue with dynamic conditions. I am using CPT; ACF ; ACF FRONTEND FORMS. The problem is Dynamic conditions are not working in simple template... Please make a video on that. Thanks

[@WPTuts]

Sorry, I'm not sure what you mean. Not working in what way?

[@maliktanveerdhool]

@@WPTuts sorry I mean to say single template. The purpose is I am offering services to Other member's. Suppose there is a ACF field " I can host?" There we will be 2 radio buttons" a; yes b; not at this time" Now I want when someone click on " yes" then conditions should be met and then the user go to next field there will be another radio buttons "a; lunch b; dinner"" Hope you can understand. I tried with dynamic conditions but didn't succeed. Please help me

[@maliktanveerdhool]

@@WPTuts mean conditions are not working.

[@saeloveart536]

I've been using the full suite of Affinity tools for a couple months, my goal is to completely abandon Adobe. I can only find tutorials on how to use pre-made mockups. But I make my own mockups from scratch. I create my own smart objects, layers, etc. Could anyone help me to achieve that in Affinity Photo? I'm currently stuck trying to create Clipping Masks... I can't find a single tutorial showing a simple way to create them... This should be as easy as in Procreate and Photoshop... but all the tutorials I find are tooo long with tooooo many steps making the process unnecessarily time consuming.

[@immeemz2]

I don't understand from watching this how to create a smart object in Affinity Photo without starting with a PSD file originally.

[@WPTuts]

This wasn't about being able to create smart objects in Affinity Photo, it was about how to edit pre-built ones.

[@immeemz2]

@@WPTuts Understood! Thanks for your excellent tutorial. If you do decide to do one on creating a smart object in Affinity Photo, I will be all over that. I have searched and Googled, but can't find any information. It doesn't make sense to me that Affinity would introduce this functionality ONLY for people who already own Photoshop anyway?? But it seems like that's what they did. Huh.

[@WPTuts]

@@immeemz2 it does seem more like a way to edit existing smart objects. Maybe this is something they are holding back until version 2.0 is released.

[@InsalataIllustrata]

This is SO useful! Thank you 🙏

[@rocknets]

Hi. Thanks for the video. I have Affinity photo for home use and Photoshop at work. It would be great if Affinity actually implemented something like smart objects, but what you are describing, is just Affinity turning a Smart object into a layer. This falls well short of what objects can be used for in Photoshop. I love that there's UK company like Affinity. They've done great at getting to a certain level, but the development needs up its game to surpass Photoshop.

[@LMoProVisualComm]

1.9 doesn't seem to handle the PSD mockups. the perspectives are all broken... any fix that you know of

[@KarliinaAnna]

thank you so much for the video, helped me so much :)

[@KayCinho]

Great job explaining Smart Objects! Affinity Photo is one of the best investments a web designer can do. I hope they work on matching the content aware fill next :)

[@WPTuts]

Absolutely! The Affinity suite is crazy value for money and the company should be applauded for their support of the design community right now.

[@michaelaligizakis]

Affinity Photo & Designer are both amazing apps. I would love to see more tutorials like this. I actually bought one more license two days ago for my windows pc since they are running a 50% off sale. That's a steal!

[@WPTuts]

Absolutely insane deal for sure. I have all the apps on PC and iPad and worth every penny at full price. :)

[@HullioGQ]

"Just when the student thinks that he's catching up to the master, the man in the black t-shirt throws the student another curve!" Paul C, you're amazing. Thanks for another nifty little lesson. PS. Your work on ACF is in my bookmarks and refer to it several times a week.

[@AdrianWinkler]

Thank you so much for this helpful tutorial. Really awesome work

[@jordanlotus188]

Very nice and very useful. please make more such videos on how to get print from mockups or how to use them . please also tell difference between mockups and print templets. using affinity publisher .Wishing you happy new year 2022.

[@lewisbyers8547]

How often do you find translation issues with mock-ups from Envato? I find most of the mock-ups I download don’t import into the program well.

[@teddchilless5645]

Can you edit a smart object? For example, a picture frame is 11x14 but you want a frame that is 12x12?

[@SophieMarnez]

WOW... this is not just a mockup opener... it's an eye opener ;-) I will be able to use Photoshop stuff and work with them. You just saved my day !!! Thank you

[@Vagnerldv]

tks