Guides
Start typing to search…

Web Links

Opening the Luscii App from a Webpage or URL

This guide explains how to open the Luscii app directly from a webpage or URL, with automatic fallback to app stores if the app isn't installed.

Overview

There are two primary methods to open mobile apps from web links:

  1. Custom URL Schemes - Traditional deep linking (e.g., luscii://)
  2. Universal Links (iOS) / App Links (Android) - Modern, secure deep linking using HTTPS URLs

For either methods, the APP_ID you want to use is:

PlatformApp IDStore Link
Androidnl.focuscura.beeldbelapphttps://play.google.com/store/apps/details?id=nl.focuscura.beeldbelapp
iOS996845239https://apps.apple.com/us/app/996845239

Method 1: Smart Fallback Pattern (Recommended for Web)

This approach attempts to open the app first, then redirects to the appropriate app store if the app isn't installed.

iOS Implementation

function openLusciiApp() {
  // Attempt to open the app
  window.location = "luscii://open";

  // If app doesn't open within 1.2 seconds, redirect to App Store
  setTimeout(function() {
    window.location = "https://apps.apple.com/app/id<APP_ID>";
  }, 1200);
}

Android Implementation

function openLusciiApp() {
  // Using Intent URL format for better compatibility
  window.location = "intent://open#Intent;package=com.luscii.app;scheme=luscii;end";

  // Fallback to Play Store if needed
  setTimeout(function() {
    window.location = "https://play.google.com/store/apps/details?id=com.luscii.app";
  }, 1200);
}

Combined Platform Detection


<button onclick="openLuscii()">Open Luscii App</button>
<script>
function openLuscii() {
  const isIOS = /iPad|iPhone|iPod/.test(navigator.userAgent);
  const isAndroid = /Android/.test(navigator.userAgent);
  
  if (isIOS) {
    window.location = "luscii://open";
    setTimeout(() => {
      window.location = "https://apps.apple.com/app/id<APP_ID>";
    }, 1200);
  } else if (isAndroid) {
    window.location = "intent://open#Intent;package=com.luscii.app;scheme=luscii;end";
    setTimeout(() => {
      window.location = "https://play.google.com/store/apps/details?id=com.luscii.app";
    }, 1200);
  } else {
    alert("Please open this link on a mobile device");
  }
}
</script>

Method 2: Universal Links / App Links (Modern Approach)

Universal Links (iOS) and App Links (Android) use HTTPS URLs that open the app if installed, or load the webpage if not.

Setup Requirements

iOS Universal Links:

  • Host an apple-app-site-association file at https://yourdomain.com/.well-known/apple-app-site-association
  • Configure associated domains in Xcode Android App Links:
  • Host an assetlinks.json file at https://yourdomain.com/.well-known/assetlinks.json
  • Configure intent filters in AndroidManifest.xml

Usage

Once configured, you can use regular HTTPS links:


<a href="https://app.luscii.com/app/id<APP_ID>">Open Luscii App</a>

The operating system automatically routes these links to the app if installed, or opens them in a browser if not.

Method 3: Programmatic Detection (For Native Integrations)

iOS (Swift)

// Check if app is installed
if UIApplication.shared.canOpenURL(URL(string: "luscii://")!) {
    // App is installed, open it
    UIApplication.shared.open(URL(string: "luscii://open")!)
} else {
    // App not installed, open App Store
    UIApplication.shared.open(URL(string: "https://apps.apple.com/app/id<APP_ID>")!)
}

Note: The URL scheme must be whitelisted in your app's Info.plist:


<key>LSApplicationQueriesSchemes</key>
<array>
    <string>luscii</string>
</array>

Android (Kotlin)

fun openLusciiApp(context: Context) {
    val packageName = "com.luscii.app"
    val pm = context.packageManager

<br />


<br />


## Best Practices

<br />

1. **Always provide fallback** - Users without the app installed should be directed to download it
   2. **Use Universal/App Links when possible** - They're more secure and provide better user experience
      3. **Test on real devices** - URL scheme behavior varies between simulator and physical devices
         4. **Handle errors gracefully** - Some browsers block automatic redirects
            5. **Add user feedback** - Show loading indicators or messages while attempting to open the app

## Enterprise/MDM Environments


For managed devices, you can check app installation status through your MDM system:

* **iOS:** Check by bundle ID (e.g., `com.luscii.app`)
  * **Android:** Check by package name (e.g., `com.luscii.app`)
    * **Common MDM platforms:** Microsoft Intune, Jamf, VMware Workspace ONE

## Developer Testing

<br />

### Android


```bash
# Check if app is installed
adb shell pm list packages | grep luscii
# Open app via intent
adb shell am start -a android.intent.action.VIEW -d "luscii://open"

iOS

# Simulator only
xcrun simctl get_app_container booted com.luscii.app data

Complete Example: Smart Link Component

<!DOCTYPE html>

<html>
<head>
    <title>Open Luscii</title>
    <style>
        .open-app-btn {
            padding: 15px 30px;
            font-size: 18px;
            background-color: #007AFF;
            color: white;
            border: none;
            border-radius: 8px;
            cursor: pointer;
        }
        .loading {
            display: none;
            margin-top: 10px;
        }
    </style>
</head>
<body>
    <button class="open-app-btn" onclick="openLuscii()">Open Luscii App</button>
    <div class="loading" id="loading">Opening app...</div>
    <script>
    function openLuscii() {
        const isIOS = /iPad|iPhone|iPod/.test(navigator.userAgent);
        const isAndroid = /Android/.test(navigator.userAgent);
        
        document.getElementById('loading').style.display = 'block';
        
        if (isIOS) {
            // Try to open the app
            window.location = "luscii://open";
            
            // Fallback to App Store after 1.2 seconds
            setTimeout(() => {
                window.location = "https://apps.apple.com/app/id<APP_ID>";
            }, 1200);
        } else if (isAndroid) {
            // Use Intent URL for better compatibility
            window.location = "intent://open#Intent;package=com.luscii.app;scheme=luscii;end";
        } else {
            alert("Please open this on a mobile device");
            document.getElementById('loading').style.display = 'none';
        }
    }
    </script>
</body>
</html>

Customization

To customize for your specific Luscii implementation, replace:

  • <APP_ID> with the actual iOS App Store ID

  • com.luscii.app with the actual Android package name

  • luscii:// with the actual custom URL scheme if different

  • https://app.luscii.com with your actual universal link domain

    Need the exact package names and URLs? Contact your Luscii integration team for the specific bundle ID (iOS) and package name (Android) to complete the implementation.

Updated 1 day ago