Choose from Assets

Select and use assets from your library in Blup to enrich your app's content and design.

Blup's robust asset management system makes it simple to select and apply images from your project assets to enhance the visual appeal of your app. Follow these steps to seamlessly integrate images into your components:

How to select images from project assets

  1. Select the Component: Start by selecting the component in your project where you want to apply an image. This could be a button, background, or any other element that supports image filling.

  2. Open the Fill Property: Click on the Fill property to open the color picker and, select an image from the top of the color picker.

  3. Choose From Assets: When you click the Choose From Assets button, you can access the Assets widget, which displays all previously added images for a quick overview of available assets.

  4. Browse the Assets: Browse through the list of assets, and when you find the desired image, click on it to select. The selected image will be applied to the selected component in your project.

Ensure that you have added images to your project by importing from Figma or selecting images. Once your images are added, click the "Choose From Assets" button.

The Choose from Assets feature is especially advantageous for projects involving repeated use of images, eliminating the need for redundant images.

Tips for Effective Image Selection

  • Organize Your Assets: Keeping your assets organized by categorizing them into folders can save you time when searching for specific images. Group similar images together for quick access.

  • Use High-Quality Images: Ensure that the images you upload to your assets library are high-resolution and suitable for your app's design. High-quality images enhance the overall appearance and professionalism of your app.

  • Optimize Image Sizes: To maintain optimal performance, use appropriately sized images. Large images can slow down your app, while images that are too small might appear pixelated. Strike a balance between quality and performance.

  • Consistent Style: Maintain a consistent visual style across your app by selecting images that align with your design theme. This consistency helps in creating a cohesive and professional-looking app.

Managing Your Assets

  • Adding New Assets: To add new images to your assets library, click on the "Add Asset" button in the Assets widget. You can upload images from your computer or import them from other sources. Make sure to use descriptive names for your assets to easily identify them later.

  • Editing Assets: If you need to edit an existing asset, such as resizing, you can do so directly within the Blup interface. Click on the asset you want to edit, and use the provided tools to make your adjustments.

  • Deleting Assets: To keep your assets library clutter-free, periodically review and delete any unused or outdated images. Select the asset you want to remove and click the "Delete" button.

Enhancing App Design with Assets

Using assets effectively can significantly enhance your app's design and user experience. Here are some additional tips for leveraging assets in your app:

  • Background Images: Use background images to create visually appealing screens. For example, a well-chosen background image can set the tone for a welcome screen or provide context for a specific section of your app.

  • Icons and Illustrations: Incorporate icons and illustrations to make your app more intuitive and engaging. These visual elements can guide users through your app and highlight important features or actions.

  • Product Images: If your app includes an e-commerce component, using high-quality product images is crucial. Ensure that your product images are clear, detailed, and showcase your products in the best light.

  • Promotional Graphics: Utilize promotional graphics to advertise new features, special offers, or important updates. These assets can capture users' attention and drive engagement with your app.

Start exploring your assets library today and transform your app's design!

Last updated