|
| 1 | +# Owl |
| 2 | + |
| 3 | +<img src="screenshots/collage_header.png" alt="Owl collage"/> |
| 4 | + |
| 5 | +## Introduction |
| 6 | +Owl is an educational app that uses Material Design components and [Material Theming](https://material.io/design/material-theming) to create an energetic, motivational brand experience. |
| 7 | +This project is the Android implementation of [Owl](https://material.io/design/material-studies/owl.html), a Material study meant to showcase componentry and Theming using the [Material Components for Android library](https://github.com/material-components/material-components-android). |
| 8 | + |
| 9 | +## Screenshots |
| 10 | +<img src="screenshots/owl_demo.gif" alt="Owl sample demo"/> |
| 11 | + |
| 12 | +## Material Theming |
| 13 | +Owl employs material theming to reflect the energy and excitement of learning a new skill, using a bold aesthetic and unfilled shapes that invite the user to populate them with new content and courses. The app customizes color, shape and typography to achieve this. |
| 14 | + |
| 15 | +### Color |
| 16 | +<img src="screenshots/color_header.png" alt="Owl color theming"/> |
| 17 | + |
| 18 | +Owl has three primary colors. Each color is used to create a distinct visual theme for each section. See [colors.xml](https://github.com/material-components/material-components-android-examples/blob/develop/owl/app/src/main/res/values/color.xml) and how they are used in [light](https://github.com/material-components/material-components-android-examples/blob/develop/owl/app/src/main/res/values/themes.xml#L58-L86) and [dark](https://github.com/material-components/material-components-android-examples/blob/develop/owl/app/src/main/res/values-night/themes.xml) themes. |
| 19 | + |
| 20 | +### Shape |
| 21 | +<img src="screenshots/shape_header.png" alt="Owl shape theming"/> |
| 22 | + |
| 23 | +Owl defines small, medium and large shape categories for different sized components. See [shape.xml](https://github.com/material-components/material-components-android-examples/blob/develop/owl/app/src/main/res/values/shape.xml) which defines the `ShapeAppearance`s, which are then [set in the theme](https://github.com/material-components/material-components-android-examples/blob/develop/owl/app/src/main/res/values/themes.xml#L20-L23) and picked up by all components or refferred to directly. |
| 24 | + |
| 25 | +### Typography |
| 26 | +<img src="screenshots/type_header.png" alt="Owl typography theming"/> |
| 27 | + |
| 28 | +Owl’s type scale provides the typographic variety necessary for the app content. All items in the type scale use [Rubik](https://fonts.google.com/specimen/Rubik) as the typeface, and make use of the variety of weights available by using Rubik Regular, Medium, and Bold. See [type.xml](https://github.com/material-components/material-components-android-examples/blob/develop/owl/app/src/main/res/values/type.xml) which defines `TextAppearance`s which are then [set in the theme](https://github.com/material-components/material-components-android-examples/blob/develop/owl/app/src/main/res/values/themes.xml#L25-L38) and referred to using `?attr/TextAppearance.Owl.*` throughout. |
| 29 | + |
| 30 | +## License |
| 31 | + |
| 32 | +``` |
| 33 | +Copyright 2019 Google, Inc. |
| 34 | + |
| 35 | +Licensed to the Apache Software Foundation (ASF) under one or more contributor |
| 36 | +license agreements. See the NOTICE file distributed with this work for |
| 37 | +additional information regarding copyright ownership. The ASF licenses this |
| 38 | +file to you under the Apache License, Version 2.0 (the "License"); you may not |
| 39 | +use this file except in compliance with the License. You may obtain a copy of |
| 40 | +the License at |
| 41 | + |
| 42 | +http://www.apache.org/licenses/LICENSE-2.0 |
| 43 | + |
| 44 | +Unless required by applicable law or agreed to in writing, software |
| 45 | +distributed under the License is distributed on an "AS IS" BASIS, WITHOUT |
| 46 | +WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the |
| 47 | +License for the specific language governing permissions and limitations under |
| 48 | +the License. |
| 49 | +``` |
0 commit comments