The GoodBarber Blog

Step by Step to Create Restaurant Apps

Written by on Wednesday, February 22nd 2017 14:07

Step by Step to Create Restaurant Apps
In our last step by step guide we walked you through the main steps to create the best app for travelers, to promote a city, a region or any tourism business really. Today, leisure is still the order of the day, with restaurant apps on the menu!

Let's get started!

1. Choose a theme

Choosing a theme is the first step to create your Beautiful App. In your back office, you will find a choice of over 50 different themes created by our designers. The theme you choose is just a starting point, you’ll be able to customize and adjust its settings completely.
Step by Step to Create Restaurant Apps

We recommend picking a style which is close enough to the color scheme or the look and feel you want for your beautiful app. For instance, for this app, we started with the theme "Green".

2. Choose the menu

After the launching screen, the menu is the second screen your users will see when opening your app. It is therefore an important feature of your app, both visually and practically. There’s a total of 9 menu templates you can choose from, with 8 predefined templates and a menu from scratch, to design your own (using HTML code). 
Step by Step to Create Restaurant Apps

Here we chose the Slate menu because we had few sections to display. We then proceeded with the customization of the colors by default (the ones assigned by the theme), the fonts, the header menu and body. In the body we added a background image, to display the logo of "our restaurant". A simple trick: we removed the page title in the field header text.
Step by Step to Create Restaurant Apps

3. Edit the header

This is where you can add your logo, if you choose to display a picture in your header. You can also use the text option and play with the different fonts. 
Step by Step to Create Restaurant Apps

Here you can edit the effects for the buttons within the app, such as the Menu button. 
Step by Step to Create Restaurant Apps

As for the body tab, it lets you customize the background, you can edit the color, add a background picture, modify the style and color of the separators and the padding of margins.

Note that at this stage, the content showing inside the app is sample content. You can edit it and create your own in the next step.
Step by Step to Create Restaurant Apps

4. Add content

Up until now, using the Sample content provided in the app can be a convenient way to achieve a great design without having an empty app. But here's how to proceed when you're ready to start adding your own content. 
  • Here we used a mCMS articles section to display the restaurant’s menu. We then customized the list of articles view, choosing a full screen display template (template n°8).
Step by Step to Create Restaurant Apps

  • Another key feature you might want to enable for booking purposes, the Form section. You can add fields tailored to your needs and as usual, customize the design.
Step by Step to Create Restaurant Apps

  • Now, for business related apps, you will find more features you can install in our Add-Ons store. This is where you can activate the Loyalty Card Add-On for instance.
Note that it is tied to the Authentication feature and is available with our Advanced plan only.
Step by Step to Create Restaurant Apps

Once the Add-On is installed a new Business tab will show in your back office menu. 
Step by Step to Create Restaurant Apps

From there, you can edit the settings as well as the design of your loyalty program. From selecting a template to customizing the icons for the points, the colors and more.
Step by Step to Create Restaurant Apps

Almost there! Two more element to add before your app is ready!
Step by Step to Create Restaurant Apps

5. Launching screen and app icon

Again, the launching screen is the first thing users will see when opening your app. It will be displayed for a few seconds while your app’s content is loading. To make a good first impression, pay attention to the specifications of the different screen sizes, to ensure optimum display.
Step by Step to Create Restaurant Apps

For the app icon, which will show on the home screen of users, you also need to comply with different dimensions, for the different operating systems. Creating the right app icon can be tricky as you have very little room for creativity, plus it needs to be self explanatory. For instance, you might need to tweak your logo somewhat, so that it adapts to a square format, and don't forget to enter the name of your app.
Step by Step to Create Restaurant Apps

As you can see in the views used in this step by step guide, you can get a real time preview of your app, right from the back office. But now that your beautiful app is finalized maybe you’re curious to see what it looks like on a real device?

Download the My GoodBarber app to get a first shot of your app on your smartphone ;) You can also use this solution to test your app. But if you're ready to publish your app on the stores we highly recommend that you test the ad hoc version of your app instead. If you’re ready to take this next step, check out this article.

Last but not least, don’t let your efforts go to waste :
- make sure your app description on the stores does a good job of advertising your app
- and check out our Ultimate guide to promoting your app, use it as a checklist so that nothing stands in the way of your app’s success.


In the same section
< >

Wednesday, March 29th 2017 - 17:53 PWAs - Technology Fundamentals and Powerful Use Cases

Monday, March 20th 2017 - 08:00 PWAs - Progressive Web Apps explained

Define your App Concept Ebook

Sign up for our newsletter

Be the first to know about our new features, discount coupons, DIY tips and more!

Scan the QRcode to download the GoodBarber News App!

Available for iOS & Android