Appless Overview

Configuring your mobile solution to best suit your needs.

 

 

 

What's AppLess?

The AppLess solution is the mobile equivalent to Crave's tablet offering.

Showcasing interactive pages and menus, an AppLess solution allows users to quickly access given information on their phone via link or most commonly, QR code.

AppLess can be used for large scale builds encompassing large orderable menus, maps and carousels, or small single menu showcases.

ezgif.com-optimize (92)
ezgif.com-video-to-gif (70)

AppLess Configuration


The AppLess configuration screen is the heart of your build. This screen contains the main tools and sections to set up your configuration to the desired specification.

There are 6 tabs along the top which control different aspects of the build, the most crucial being Generic, Pages, Navigation Menus & Themes.

It is worth noting the tick boxes on the generic tab, cookie walls should be removed for markets that do not operate with cookies. Responsive mode should be enabled for instances where guests/users may be viewing the page via a large screen such as a laptop or monitor.

AppLess Themes


AppLess Themes can be found under the 'Themes' tab within the AppLess configuration.

AppLess themes can be created and assigned to individual pages to manage the colours displaying to best match the brand or aesthetic you are trying to achieve.

Themes contain 6 fields, each controls a visible colour element within your build and works off hex codes.

It is worth playing around with Themes to learn which fields control which areas of the build to help you achieve a clean and appealing colour scheme.

themes
ezgif.com-optimize (93)

Pages Overview

AppLess pages are the building blocks to your project and are the elements that users will see, use and navigate around.

Pages can be created and linked together via page widgets to create an explorable journey for guests to use and navigate through. Each page will have its own URL link to different it from the other pages.

It is worth noting, one page should act as your default landing page. This is the first page a user will see after scanning a QR code and hence should look appealing and act as a central hub for linking to sub pages or external sites.

You can see from the example, how the page structure in the CMS translates onto the live page.

Configuring Pages

Pages are built using a series of page widgets but also require certain other AppLess elements to be assigned to them, such as an outlet, a theme and a navigation menu. These will need to be created first and then assigned to each page individually, allowing for different pages to have different themes and checkouts.

The green plus can be used to insert your widgets onto your page. There are a variety of widgets to choose from and more details on each of these are available below.

Once you have inserted your widget, you can edit them using the pen and paper icon to the right hand side of the item.

ezgif.com-optimize (95)
ezgif.com-optimize (94)

Hero Images


Hero images are large, horizontal images that typically sit at the top of a page.

Hero images are set in the dimensions - 1242 x 528 pixels.

These hero images should be created in external software and should ideally include a small about of text, such as a page title to keep users informed of what page they are on, whilst also keeping the page visually appealing.

Configuring Hero Images


Once you have created or gathered your image in the correct image format, you can upload your hero image to one of your pages.

Create the widget by pressing the green plus on your desired page and name the widget and select hero from the list.

Once created, press the pen and paper icon to enter the hero image settings. In here you can upload your desired image and set a destination link should the image be pressed by a user. If you do not wish the hero image to go link anywhere, you can link it to the same page.

Action Banners

Action Banners

Action banners are an easy way to link away from the current page to either another page, category, product or weblink. These banners will always sit above each other on the page and are great for a clear button or action.

Action banners can be added to any AppLess page and can be configured using the pen and paper icon to the right hand side. 

These banners can show text, which is translatable, and also show an image. These two elements can be paired together simultaneously to create a clear and appealing banner.

It is worth noting that for more brand specific and engaging banners, the banner images are created in external software and include the text in the image.

Configuring Action Banners


Action banners are added in the same way as hero images and configuration consists of setting a destination link and adding a image similar to the configuration of a hero image.

Text can also be configured in the system should your image not already contain text.

Use the green plus button to insert your action banner widget and use the pen and paper icon to enter the configuration settings to set the text and link, and insert your background image if applicable.

image_2023-12-08_144352761

Action Buttons


Action buttons are very similar to action buttons however work in slightly different ways.

Action buttons, when added to a page, allow you to add up to 3 buttons in the row which can all link off elsewhere, the same as the action banners.

Action buttons are made up of text and either an image or an icon. These can be configured in a similar way to action banners and are very useful for limiting the amount of scrolling needed on a page due to their horizontal nature.

Please note - If your AppLess configuration is set to be responsive, action buttons should be used over action banners as they appear clearer in these instances.

Configuring Action Buttons


Action buttons are configured slightly differently to hero images and action banners. An action button widget can hold up to 3 individual buttons and these will appear along one line.

To add another row of buttons a new action button widget needs to be made and then configured like the first.

To add an action button widget, click the green plus button and select action buttons from the list of widgets. Enter the configuration by clicking the pen and paper icon and you can then click the green plus again to insert up to 3 buttons.

To configure each button you will need to click the pen and paper icon of each button. Action buttons can hold text, icons, images and destination links.

ezgif.com-optimize (98)

Carousels

Carousels act as a slideshow of images on an AppLess page and can also contain a button which when pressed can link off to another destination within the AppLess build or to an external site.

Carousel images consist of a text field, a linking field and an image field. As with hero images, text is often added to the image in external software and hence the system text is often not used however the functionality is still there should it be needed.

There are no limits to the number of images in the carousel however we would advise keeping the limit to 5 -6 to avoid excessive scrolling.

Configuring Carousels

Carousels, like other page widgets can be added by clicking the green plus button on your chosen page. This will create your carousel widget, to create individual slides you will need to enter the carousel widget using the pen and paper icon.

Once inside the widget, you can create individual slides by again using the green plus button and pen and paper icons for each to add the respective image, text and links.

If adding a link to a slide, please note the button text will autofill to be the same as the name of the slide unless you manually adjust it within the link settings.

Additonal Widgies

Additional Widgets

There are a few additional page widgets that can be selected when pressing the green plus button on an AppLess page, these include;

- Page Titles - These widgets when added to a page insert a large bold line of adjustable text which will appear in the primary colour set in the AppLess Theme.

- Language Switchers - These widgets when added to a page allow users to select other languages should they be available. If changed the page will translate to the chosen language. Language switchers can also be added to navigation menus.

- Markdown - Markdown widgets can be used to insert HTML style elements into AppLess pages. Markdown widgets allow you to input stylized text, custom images and more via HTML code.

- Maps - Map widgets can be inserted into AppLess pages and when pressed opens a custom map which can be configured in the CMS via points of interests.

Outlets

Outlets act as the checkout pop ups in your AppLess build once an item has been added into the basket.

Outlets can be found under the AppLess tabs and the Outlets. These are separate from the rest of the AppLess configuration menus.

Outlets contain a lot of important information which will dictate the flow of the checkout, how the user will receive their items and how they will be charged.

Outlets contain information such as tipping options, marketing information and customer information request fields that can be configured as desired.

ezgif.com-optimize (96)

Customer Details, Gratuity & Business Hours


Outlets can be configured to take specific customer details, include customizable gratuity and adjust active business hours.

On the generic tab, there are 3 optional tick boxes for required guest information, name, email and phone number. If you require any of this information, be sure to tick the boxes here.

Gratuity can be added in an outlet so users are shown a tipping field. This can be set to include a default tip amount, a minimum tip amount and the ability to adjust step size, allowing users to tip an amount of their choosing.

Should you wish all items to be non-orderable during certain times like overnight, business hours can be set under the business hours tab. If users look at orderable products outside of these hours, they will be informed when they will next be available.

Service Methods


Service methods can be found within an outlet and control how the user will receive their items.

Multiple service methods can be created and added to an outlet if there are multiple options a user can choose from.

Service methods include;

- Room Service

- Table Service

- Pick Up or Collection

- Delivery

The most common service method is room service and is often used in hotels as the standard service method for room service and item requests.

Please note, when creating a service method, the relevant deliverypoint groups will need to be selected at the bottom of the screen. If only there is only 1 deliverypoint group, this will need to be selected.

Checkout Methods


Checkout methods can similarly be found within an outlet and control how the user will be charged for their request or purchase.

Multiple checkout methods can be created and added to an outlet if multiple payment options are available for the user,

Checkout methods include;

- Charge to Room

- Payment Provider (Card Payment)

- Pay Later

The most common checkout method is usually charge to room for hotel instances, where the total of the order will be added to the room total. Payment provider is also a common checkout method allowing users to pay by card during the checkout process.

Navigation Menus


Navigation menus are always visible via the hamburger menu in the top right of the AppLess pages and act as a shortcut menu to different areas of content of your choosing.

Navigation menus are created and adjusted within the AppLess configuration screen, under the navigation menu tab.

An item may be entered with a simple name and a destination link. A common example of a hotel navigation menu could be;

-Home

-In-Room Dining

-Guest Services

-Spa

-Contact

These points in the menu would then link to the relevant content build in the CMS or to an external site.

ezgif.com-optimize (97)

Speak to the team

Our team is always on hand to help with any content requirements you may have, so please do not hesitate to contact us.


Via phone:

UK: +44 (0)330 403 0144

US: +1 877.778.7621                                                                                                          


 

Via Instant Video

 

Start an Instant Video call with the Crave team now and speak to a member of the team available to handle any of your queries! 

 

New call-to-action

Via Email