ui

Hero image for article
Icon for article
beginnerionicsvguiux

Custom SVG Icons in Ionic with Ionicons

4 min read

In this tutorial, I am going to walk through how you can implement our own custom icons when using Ionicons in an Ionic application.

Hero image for article
Icon for article
beginnerionicuiux

A Primer on CSS Variables/Custom Properties for Ionic

4 min read

In this article, we are going to take a brief look at what CSS variables are and how we will be using them in Ionic applications.

Hero image for article
Icon for article
angularcomponentintermediateionicuiux

Improving the UI/UX of an Ionic Component

6 min read

In this tutorial, we improve the UI/UX of an existing component by adding another component to it!

Hero image for article
Icon for article
animationintermediateionic2uiux

Create a Sliding Item Animation with a Directive in Ionic 2 & 3

6 min read

In this tutorial, we are going to walk through how to create a directive to create an animation for a sliding item.

Hero image for article
Icon for article
intermediateionic2uiuxvideo

Creating an Asynchronous Login Screen in Ionic 2

1 min read

In this video tutorial, we are going to walk through how to create an asynchronous login screen in Ionic 2.

Hero image for article
Icon for article
animationintermediateionic2uivideo

Build a Custom Flash Card Component in Ionic 2 – Part 2

1 min read

In this tutorial, we will be building our own custom flash card component in Ionic 2

Hero image for article
Icon for article
beginnerionic2uivideo

Hacking CSS in Ionic 2

1 min read

You can use Ionic's built in utility attributes, you can overwrite SASS variables or create your own, and you can also define your own custom CSS rules.

Hero image for article
Icon for article
animationintermediateionic2ui

Build a Custom Flash Card Component in Ionic 2 & 3

4 min read

In this tutorial, we will be building our own custom flash card component in Ionic 2

Hero image for article
Icon for article
advancedanimationionic2performanceui

High Performance Parallax Animation in Ionic 2

7 min read

In this tutorial, I am going to walk through how to build a high-performance parallax directive for Ionic 2.

Hero image for article
Icon for article
beginnerionic2ui

A List of Common CSS Utility Attributes in Ionic 2

3 min read

In this post, I am going to introduce you to some of the key utility attributes that Ionic provides.

Hero image for article
Icon for article
beginnerionic2uiuxvideo

Component and Template Interaction in Ionic 2

11 min read

In this video tutorial, I introduce the concepts of Property Binding, Event Binding, Interpolation, and Two-Way Data Binding

Hero image for article
Icon for article
beginnerionic2uiuxvideo

Conditional Attributes, Styles, and Classes in Ionic 2

1 min read

In this video tutorial, we take a look at how to conditionally apply attributes, styles, and classes to elements in Ionic 2.

Hero image for article
Icon for article
intermediateionic2uiuxvideo

Create a Menu with Active Page Highlight in Ionic 2

1 min read

In this video tutorial, we will build some functionality that will allow us to highlight the currently selected menu option.

Hero image for article
Icon for article
google mapsintermediateionic2uiux

Create Marker Clusters with Google Maps in Ionic 2

4 min read

In this tutorial, we are going to walk through how to add marker clustering to a Google Map in an Ionic 2 application

Hero image for article
Icon for article
componentintermediateionic2uiux

Build a Simple Progress Bar Component in Ionic 2 & 3

5 min read

In this tutorial, we are going to build a custom progress bar component that we can use in an Ionic 2 application.

Hero image for article
Icon for article
beginnerionic2uiuxvideo

An Overview of the Grid Component in Ionic 2

1 min read

In this video tutorial, I walk through the basics of how to use the Grid component in Ionic 2.

Hero image for article
Icon for article
intermediateionic2uiux

Create a Stylish News Feed Layout in Ionic 2 & 3

6 min read

In this tutorial, we are going to walk through an example of building a stylish news feed layout in Ionic 2.

Hero image for article
Icon for article
intermediateionic2uiux

Automatic Profile Pictures with Gravatar in Ionic 2

3 min read

In this tutorial, I am going to show how you can integrate Gravatar into the signup process in an Ionic 2 application.

Hero image for article
Icon for article
advancedionic2uiux

Create an Advanced Photo Tilt Component in Ionic 2

5 min read

In this tutorial, we create a custom photo tilt component in Ionic 2 based on Facebook's Paper UI.

Hero image for article
Icon for article
advancedionic2performanceuiux

Create a News Feed with 360-Degree Photo Viewing in Ionic 2 & 3

5 min read

In this tutorial, we will build a news feed layout in Ionic 2 which includes support for viewing panorama photos by tilting the device.

Hero image for article
Icon for article
intermediateionic2uiux

Improve Mobile Form UX with Input Masks

7 min read

In this tutorial, we are going to go through an example of how we can use input masking in Ionic 2 to provide a better user experience.

Hero image for article
Icon for article
intermediateionic2uiux

Creating a Music Player Interface in Ionic 2 & 3

7 min read

In this tutorial, we will be building a custom music player interface in Ionic 2, with a focus on creating a visually pleasing design.

Hero image for article
Icon for article
beginnerionic2uivideo

Using Semantic CSS Styling in Ionic 2

1 min read

In this video tutorial, I walk through a semantic approach to creating styling in Ionic 2. This style relies more heavily on using the semantic structure of the template to apply styles.

Hero image for article
Icon for article
intermediateionic2ui

Build a Tap to Reveal Component in Ionic 2 & 3

3 min read

In this tutorial we are going to walk through how to build a simple tap to reveal component in Ionic 2.

Hero image for article
Icon for article
advancedcomponentionic2uiux

How to Create a Sliding Drawer Component for Ionic 2

6 min read

In this tutorial, I am going to walk through how to create a sliding drawer component in Ionic 2.