DenchClaw Gallery View: Visual CRM Browsing

DenchClaw's gallery view displays your CRM entries as a grid of visual cards instead of table rows. For data that benefits from a visual, card-based layout — contact profiles, product listings, real estate properties, creative assets, media contacts — the gallery view gives you a scannable, information-dense display that's far easier to browse than a spreadsheet.

When to Use Gallery View#

Gallery view works best when:

• You're browsing a catalog rather than a pipeline (e.g., contacts, properties, products)
• Profile images or cover images are part of your data
• Summary information is more useful than detailed columns
• Visual identity matters (company logos, project images)
• Card layout helps you pattern-match faster than row scanning

Good use cases for gallery view:

• Contacts object — card per person with photo, name, company, status
• Properties object — card per property with photo, address, price, status
• Products object — card per product with image, name, price, category
• Portfolio Companies — card per investment with logo, stage, sector
• Media Contacts — card per journalist with publication, beat, tier
• Creative Assets — card per asset with thumbnail and metadata

Less ideal for gallery view:

• Pipeline management (use Kanban)
• Date-based scheduling (use Calendar)
• Detailed comparison across many fields (use Table)

Setting Up Gallery View#

Configure gallery view in your .object.yaml:

default_view: gallery
 
view_settings:
  gallery:
    coverField: Profile Photo      # Field to use as card cover image
    titleField: Full Name          # Primary text on the card
    subtitleField: Company         # Secondary text below title
    badgeField: Status             # Colored badge (uses status colors)
    metaFields:
      - Email
      - Phone
      - City
    cardWidth: medium              # small, medium, or large
    showEmptyCards: true           # Show cards even if no image

Or ask DenchClaw: "Switch the People object to gallery view, using the profile photo as cover, full name as title, and company as subtitle."

Card Anatomy#

Each gallery card contains:

1. Cover image (optional) — from a file or URL field, full-width at the top of the card
2. Title — the primary identifying field (usually name)
3. Subtitle — secondary identifier (company, role, etc.)
4. Badge — a colored status badge using your statuses: color configuration
5. Meta fields — 2-4 additional fields shown below (email, phone, location, etc.)
6. Action button (optional) — if an action field is configured

Clicking any card opens the full entry detail view.

Cover Images#

Gallery view shines brightest when your entries have associated images. DenchClaw supports cover images from:

• File fields — an uploaded image file stored locally
• URL fields — a public image URL (company logo from Clearbit, headshot from LinkedIn, product image from a CDN)

For contacts, you can enrich with profile photos automatically. Ask DenchClaw: "For each person in my database, try to find their profile photo from LinkedIn or Clearbit and add it to the Photo URL field."

DenchClaw's browser agent can open LinkedIn with your existing session and pull profile photos for known contacts.

Gallery View with Filters#

Gallery view respects all saved view filters. Create a gallery view specifically for your active prospects:

views:
  - name: Active Prospects Gallery
    type: gallery
    filters:
      - field: Status
        operator: equals
        value: Prospect
    sort:
      field: Last Contacted
      direction: desc

Switch between gallery and table on the same view — the filter stays active, only the display changes.

Card Density Options#

Three card density options for different data densities:

• Small — minimal cards, fits more per row, good for image-heavy browsing
• Medium (default) — balanced text and image, best for most use cases
• Large — bigger cards with more visible fields, good for detail-rich records

Gallery View in Dench Apps#

When building custom Dench Apps, you can replicate the gallery layout using DuckDB query results and CSS grid:

const contacts = await dench.db.query(
  "SELECT * FROM v_people WHERE Status = 'Lead' ORDER BY created_at DESC"
);
 
const gallery = document.getElementById('gallery');
contacts.forEach(contact => {
  gallery.innerHTML += `
    <div class="card">
      <img src="${contact['Photo URL'] || '/placeholder.png'}" />
      <h3>${contact['Full Name']}</h3>
      <p>${contact['Company'] || ''}</p>
      <span class="badge">${contact['Status']}</span>
    </div>
  `;
});

Comparing Gallery to Other View Types#

See also: DenchClaw List View for compact scanning mode and DenchClaw Saved Views for applying filters to any view type.

Frequently Asked Questions#

Can I show gallery view on a Kanban board?#

No — Kanban and gallery are separate view types. Kanban groups cards by a status column; gallery shows all matching entries in an unstructured grid. You can save separate Kanban and Gallery views for the same object and switch between them.

How do I add cover images to existing entries in bulk?#

For company logos, DenchClaw can use Clearbit's logo API. Ask: "For each company in my database, look up the company logo from Clearbit and save the URL to the Logo URL field." DenchClaw can do this in batch for dozens of companies.

Can gallery view show a placeholder if there's no image?#

Yes. Set showEmptyCards: true in your view_settings — cards without images show a placeholder with the entry's initials or a generic icon.

Does gallery view support sorting?#

Yes. Add a sort: configuration to your view settings just like table view. Cards render in sort order from left to right, top to bottom.

Can I use gallery view for entries with no images?#

Absolutely. Gallery view without images still provides a useful card-based summary layout. The cover area will be blank or show a colored placeholder based on the status. The card layout is still valuable for visual scanning even without images.

Ready to try DenchClaw? Install in one command: npx denchclaw. Full setup guide →