This is how thousands of images have been stored.

How do I access these images in an Avatar?

The image component create a correct URL when you use the “attachment” Image Source method. (Which only really works if you created the image using the skuid File Upload tool – as you have done. (Well done)

The Avatar component needs a fully formed URL - which you need to construct.

In your case the Avatar Image URL would look like this:

/servlet/servlet.FileDownload?file={{Person__r.Photo__c}}

I have tried both:

/servlet/servlet.FileDownload?file={{Person__r.Photo__c}}

However it does show in image

Must be missing something