Delight Your App Users with Customized User Preferences

User Preferences can significantly enhance the user experience and tailor the application to individual needs.

Here are the 8 common use cases that can be implemented across various B2B SaaS applications:

1. Dashboard Customization:

• Allow users to customize their dashboard layout, widgets, and data visualizations.

• Example: Users can choose which metrics to display and how to arrange them on the dashboard.

2. Notification Settings:

• Enable users to control the frequency and types of notifications they receive (e.g., email, in-app notifications).

• Example: Users can choose to receive notifications for new tasks, completed projects, or important updates.

3. Data Filtering and Sorting:

• Provide options for users to filter and sort data based on their preferences.

• Example: In a project management tool, users can filter tasks by status, priority, or due date.

4. Language and Locale Settings:

• Support multiple languages and allow users to select their preferred language and locale.

• Example: Users can switch between English and Spanish in a global SaaS application.

5. Accessibility Settings:

• Provide options for users with disabilities, such as larger fonts, high-contrast themes, or screen reader compatibility.

• Example: Users can adjust font size, color scheme, and keyboard shortcuts.

6. Dark Mode:

• Offer a dark mode option for users who prefer a darker interface. Remember this preference.

• Example: Users can switch between light and dark modes for improved readability and visual comfort.

7. Default View Settings:

• Allow users to set their preferred default view for lists, tables, or dashboards (e.g., card view, list view, table view).

• Let user choose which columns to show and in what order and remember it.

8. Onboarding Guidance:

• Monitor the user's progress through the onboarding process and provide reminders or additional support as needed.

• Analyze user behavior to identify features that the user has not yet explored.

• Suggest features that might be relevant based on the user's role, preferences, and usage patterns.

The SQL to create such a User Preference will look like:

CREATE TABLE user_preference (    
id BIGSERIAL PRIMARY KEY,  -- Auto-incrementing ID for the table entry    
user_id BIGINT NOT NULL,  -- ID of the user whose preference is being added    
key VARCHAR(255) NOT NULL,  -- The string to identify the use case being added/modified    
preference JSONB,  -- The JSONB field to store the JSON data of the preference.    
CONSTRAINT fk_user FOREIGN KEY (user_id) REFERENCES users (id) ON DELETE CASCADE    
);

Sample Values for the above 8 use

Here are the appropriate “key” and “preference” values for each of the above use cases:

Dashboard Customization:

Key: "dashboard_layout"

{
  "widgets": [
    "metric1",
    "metric2",
    "metric3"
  ],
  "layout": "grid",
  "positions": [
    {
      "metric1": {
        "x": 0,
        "y": 0
      },
      "metric2": {
        "x": 1,
        "y": 0
      },
      "metric3": {
        "x": 0,
        "y": 1
      }
    }
  ]
}

This preference stores the user's chosen widgets and their positions on the dashboard.

Notification Settings:

Key: "notification_settings"

{
  "email_notifications": true,
  "in_app_notifications": false,
  "frequency": "daily",
  "categories": {
    "new_tasks": true,
    "completed_projects": true,
    "important_updates": false
  }
}

This stores the user's notification preferences, including types of notifications and frequency.

Data Filtering and Sorting:

Key: "task_filter_sort"

{
  "filters": {
    "status": "in_progress",
    "priority": "high",
    "due_date": "next_week"
  },
  "sort_by": "due_date",
  "sort_order": "asc"
}

This stores preferences for filtering and sorting tasks in a project management tool.

Language and Locale Settings:

Key: "language_locale"

{
  "language": "en",
  "locale": "en_US"
}

This stores the user's selected language and locale.

Accessibility Settings:

Key: "accessibility_settings"

{
  "font_size": "large",
  "theme": "high_contrast",
  "screen_reader": true
}

This stores accessibility preferences, including font size and theme.

Dark Mode:

Key: "dark_mode"

{  "enabled": true}

This stores whether the user has enabled dark mode.

Default View Settings:

Key: "default_view_settings"

{
  "view_type": "card",
  "columns": [
    "name",
    "priority",
    "status"
  ],
  "column_order": [
    "name",
    "status",
    "priority"
  ]
}

This stores the user's preferred default view and column order for lists or tables.

Onboarding Guidance:

Key: "onboarding_progress"

{
  "completed_steps": [
    "step1",
    "step2"
  ],
  "pending_steps": [
    "step3",
    "step4"
  ],
  "suggested_features": [
    "featureA",
    "featureB"
  ]
}

This stores the user's onboarding progress and suggested features.

Here is the API contract to fetch the list of UserPreference entries for a user:

API Endpoint:

Lists the preferences of the Logged In user

GET /preferences

Header → Authorization: Bearer <token>
(Required for authentication)

GET /api/user/preferences/ \
-h 'Authorization: Bearer <token>'

Response

{
  "preferences": [
    {
      "id": 1,
      "user": 123,
      "key": "dashboard_layout",
      "preference": {
        "widgets": [
          "metric1",
          "metric2",
          "metric3"
        ],
        "layout": "grid",
        "positions": [
          {
            "metric1": {
              "x": 0,
              "y": 0
            },
            "metric2": {
              "x": 1,
              "y": 0
            },
            "metric3": {
              "x": 0,
              "y": 1
            }
          }
        ]
      }
    },
    {
      "id": 2,
      "user": 123,
      "key": "dark_mode",
      "preference": {
        "enabled": true
      }
    },
    {
      "id": 3,
      "user": 123,
      "key": "language_locale",
      "preference": {
        "language": "en",
        "locale": "en_US"
      }
    },
...
...
  ]
}