[Music]
hello hello welcome to solving with AWS
solutions your deep dive in
architectures built by AWS that are
ready to deploy instantly in the cloud
I'm Rob your host joined today with a
woman who loves it when the weatherman
predicts clouds hey Rach Shauna how are
you excited to be here so today we are
talking about serverless image handler
what exactly is sih the Sylvanas image
handler solution enables customers to
achieve dynamic image processing and
manipulation using aw services the
solution is fast cost-effective and has
internet skill that's awesome so what
organisations would be interested in
something like this the solution is
going to be perfect for customers who
manage websites and mobile apps to
service their end customers these
companies will typically end up having
to maintain hundreds or even thousands
of images which is gonna be a lot of
overhead to manage but don't worry
that's exactly where service image
handler comes into play and shines
that's awesome so let's take a closer
look at serverless image handler let's
do it all right Rach Shauna let's talk
about service image hamlets what's going
on as part of this architecture yeah
sure so I have the solution landing page
open for service image Handler this page
is a wealth of resources so you're gonna
find the architecture diagram here
which talks about how we have designed
the solution then there is also a link
from this page to do a one-click
deployment of the solution in your AWS
account that's with the CloudFormation
template all right exactly
great then there's also a link to the
deployment guide which is more like an
instruction manual on how to do a
step-by-step deployment of the solution
and work with the solution that's cool
so it simplifies it so even my dad could
deploy it yeah and then there's also a
link to the source code on github from
here good so customers could actually
download and customize yeah do what
about your business need is me alright
so let's get into the solution
architecture okay so it all starts with
an Amazon CloudFront which is going to
be used for global content delivery and
this is going to be sitting behind the
websites and the mobile
apps that customers are going to use the
interesting thing about CloudFront is
that it also provides a layer of caching
ok well it's gonna store some of the
frequently requested images and just
pull the images from here for customers
whenever they load their websites or the
mobile apps so cut so it actually
doesn't have to reprocess an image it's
already processed but yeah it's caching
and storing it yeah ok so this provides
a super fast response for customers and
it greatly improves the customer user
experience that's awesome what else is
going on and then we also have the
Amazon API gateway which has the
endpoint resources and this triggers the
AWS lambda whenever that website is
loaded by customers so lambda is the
server list and serverless image handler
exactly all right so being sober list it
increases the adju beauty as well as
lowers the cost for customers and what
the a double is lambda function is going
to do when it gets triggered is to
retrieve any of the images that customer
have in their s3 bucket okay and it's
gonna do the dynamic processing and
manipulation of the images using an open
source image processing and manipulation
module called sharp so the first time
that a customer actually requests this
image that's when the process had
happened but then it's cached in
CloudFront yeah exactly that's pretty
cool yeah so all of these images are
dynamically done whenever the customers
requests for the whenever customers load
their websites or the mobile apps and
this sends the request you so how can we
test this rosh hashanah great question
so we have a demo UI that you can also
deploy as part of the solution there's a
completely optional feature but this is
just to demonstrate how you know the
end-to-end workflow is going to look
like and it's gonna show how you can
import the images from your s3 bucket
what sort of edits you can perform and
we have some illustrative you know edits
that that you can perform your customers
can choose to add more edits ok and you
can also see how the final image is
going to look like and how the JSON body
of the image request is going to change
and finally how the encoded URL is going
to look like that's going to be sitting
behind these images that's awesome so do
you have a test image we could look at
yeah so I have a deployment done alright
and I have a test bucket set up so I'm
gonna import an image from here Hey
looks familiar isn't it cute adorable so
what now what types of edits can we do
to this yeah so you can do a lot of
changes to the width height you can
resize it completely change the color do
smart cropping so on and so forth so let
me just do an example alright so let me
change the width and let me probably
resize this to fit you know a smaller
screen this is more for a mobile device
yeah tablets so let's preview this oh
wow so now that fits a more mobile
centric type of exactly and this is how
the JSON body of the image request is
going to change okay and this is what is
going to be packaged into this encoded
URL which is basically a combination of
the API endpoint for the image handler
as well as this encoded image request in
the JSON format this is the URL that's
going to be sitting behind the images on
your websites and mobile apps awesome so
you mentioned smart cropping what
exactly is going on with that yeah
that's a fun feature the secret review
let me show you that so smart cropping
basically leverages Amazon recognition
which provides the facial recognition
capabilities do identify the facial
features and just crop that part out so
AI on my actual dog yeah that's pretty
cool
so I've enabled smart shopping let's see
how it works oh nice so it's actually
able to dynamically zoom in on my dog
and you didn't have to train it to do
that at all no not at all yeah that's
pretty impressive it's pretty out of the
box and these are all illustrative edits
on the images you can continue to add
more edits and you can see how the image
body as well changes dynamically that's
pretty cool so serverless image handler
talked to me about some of the benefits
so firstly it provides a super-fast
an experience for customers and it's a
cost effective way of managing thousands
of images on all your websites and
mobile apps and it provides internet
scale thank you so much for talking
about serverless image and handler with
me thank you
serverless image handler enables
companies to provide a great user
experience for their customers while
also reducing the cost for dynamically
processing and storing multiple images
to check out sylvilla's image handler
and all of our other solutions
go to our aw solutions page thanks and
see you next time
[Music]