Hackathon Submission Entry form

Team name

⟹ The Weel of the blackbull battles

Category

⟹ Best use of AI

Description

⟹ The “Smart User Carousel" is a hero carousel that use Leonardo AI to get images based on a pront, the idea of the component is get images easaly using AI and saved directly in the media library for getting them then.

Video link

https://www.youtube.com/watch?v=yXFPUXkHuS8

Pre-requisites and Dependencies

-Sitecore Management Services 5.2.113 https://dev.sitecore.net/Downloads/Sitecore_CLI/5x/Sitecore_CLI_52113.aspx

Installation instructions

-Install Sitecore 10.3.1 standalone

-using the PS Script set the following in these variables:

-- $Prefix = "wbb-hackaton"

-- $SitecoreSiteName = "$prefix.local"

-- $XConnectSiteName = "$prefix.xconnect"

Run the installation process

-make sure your domain is like this one: https://wbb-hackaton.local/

-clone the main branch in a folder

-open the solution

-build the solution and restore the nuget packages

-using the Website project, deploy the project to the sitecore instance using the publishin process

-Open a PS Terminal in the root of the solution

-execute the following commands -- dotnet tool restore

-- dotnet sitecore init

-- dotnet sitecore plugin init

-- dotnet sitecore login --authority https://wbb-hackaton.identityserver/ --cm https://wbb-hackaton.local/ --allow-write true

--- do the login process and close the window

-- dotnet sitecore ser push

install the following package in the sc instance

Smart Carousel Items.zip

--in in the folder .\scPackages\Smart Carousel Items.zip

-publish all website

Configuration

⟹ If there are any custom configuration that has to be set manually then remember to add all details here.

Remove this subsection if your entry does not require any configuration that is not fully covered in the installation instructions already

Usage instructions

Generate Carousel

The “Smart User Carousel” component requires a data source to generate the carousel images automatically. The data source has information like the prompt and the number of images to generate. To create a new generation data source you need to create an item using the “Hero Carousel AI” template. In the following example we are going to generate 4 images for our carousel.

1. Create a new “Hero Carousel AI” item. In the next example the item is going to be created in the Data directory and its purpose is to generate a carousel for a music store page.
2. Set the values for generating the images. The prompt should describe what kind of images you want to generate. The height and width properties must be multiples of 8. The image creative model is going to define the model that Leonardo.ia is going to use for generating the images (refer to Leonardo Ai Finetuned Models - Leonardo.Ai for more information).
3. Insert the “Smart Carousel” rendering using the data source item created on the previous step to generate the group of images.
4. Navigate to the page, the images are going to be automatically generated.
5. Select the images that you want to preserve for the final carousel and click save.
6. The images are going to be created on your media library as well as the data source item that can be used on the final render.
7. Insert the “User Smart Carousel” using the data source generated on the previous step.
8. The carousel will display the generated images.

Comments

If you'd like to make additional comments that is important for your module entry.