2023-08-14 17:58:18 +02:00
|
|
|
#+title: Interaction Pattern: Feature, Search, and Browse
|
|
|
|
|
#+author: Marcus Kammer
|
|
|
|
|
#+date:[2023-08-14 Mon]
|
|
|
|
|
#+email: marcus.kammer@mailbox.org
|
|
|
|
|
#+license: MIT
|
|
|
|
|
|
|
|
|
|
* Introduction
|
2023-08-14 17:49:50 +02:00
|
|
|
|
|
|
|
|
- This design outlines a commonly employed interaction pattern on websites or
|
|
|
|
|
apps. This pattern is mainly a trio of elements:
|
|
|
|
|
|
|
|
|
|
1. Featured content
|
|
|
|
|
2. Search box
|
|
|
|
|
3. Browsable items/categories
|
|
|
|
|
|
|
|
|
|
** Key Points
|
2023-08-14 17:58:18 +02:00
|
|
|
|
2023-08-14 17:49:50 +02:00
|
|
|
*** What
|
|
|
|
|
|
|
|
|
|
- The pattern consists of a prominently displayed feature (like an article or
|
|
|
|
|
product), a search function, and a list or categories of content for
|
|
|
|
|
browsing.
|
|
|
|
|
|
|
|
|
|
*** When to use
|
|
|
|
|
|
|
|
|
|
- Suitable for sites/apps with an extensive list of content.
|
|
|
|
|
- Engage visitors immediately by presenting captivating content.
|
|
|
|
|
- For sites primarily focused on search or transaction functions, the search
|
|
|
|
|
box becomes the central feature, with the rest being secondary.
|
|
|
|
|
|
|
|
|
|
*** Why use this pattern
|
|
|
|
|
|
|
|
|
|
- Searching & Browsing: They aid users in finding their desired content.
|
|
|
|
|
- Engagement through Featured Items: Capture user attention through immediately
|
|
|
|
|
accessible content.
|
|
|
|
|
|
|
|
|
|
** Applications
|
|
|
|
|
|
|
|
|
|
1. E-commerce sites: For product-specific or category browsing. Featured
|
|
|
|
|
products can promote new arrivals or sales.
|
|
|
|
|
2. News portals: Users can search for news or navigate through categories.
|
|
|
|
|
Highlighted articles can present breaking or vital news.
|
|
|
|
|
3. Streaming platforms: Users might search for a show or browse genres.
|
|
|
|
|
Featured content can showcase popular or new releases.
|
|
|
|
|
|
|
|
|
|
** Considerations
|
|
|
|
|
|
|
|
|
|
- Balance between the three elements is pivotal.
|
|
|
|
|
- Design responsiveness is essential for various device compatibility.
|
2023-08-14 17:51:10 +02:00
|
|
|
- Enhance engagement with personalized content based on user history or
|
|
|
|
|
preferences.
|
2023-08-14 21:34:28 +02:00
|
|
|
|
|
|
|
|
* Content centric
|
|
|
|
|
|
|
|
|
|
#+begin_src lisp
|
|
|
|
|
(ql:quickload :cl-sbt)
|
|
|
|
|
(defpackage cl-sbt/fsb/content
|
|
|
|
|
(:use :cl)
|
|
|
|
|
(:import-from
|
|
|
|
|
:cl-sbt/form
|
|
|
|
|
:ctrl-col))
|
|
|
|
|
(in-package :cl-sbt/fsb/content)
|
|
|
|
|
|
|
|
|
|
#+end_src
|
|
|
|
|
|
|
|
|
|
#+RESULTS:
|
|
|
|
|
| :CL-SBT |
|
|
|
|
|
|
|
|
|
|
* Commerce centric
|
|
|
|
|
|
|
|
|
|
* Task centric
|
