Music App

Development of the Music Education App “Música Seis”

Client: Santillana Editores
Year: 2017
Project type: App Development, Web Development

WE DEVELOPED THE APP THAT SUPPORTS THE SCHOOL BOOK “MÚSICA SEIS”.

Within the scope of the project “Música Seis – Educação Musical 6º ano“, the publisher Santillana Editores approached our team with the aim of developing a mobile and web app, that supports their school book.

The app, accessible to students and teachers, aims to increase the students’ involvement with the Music Education subject, promoting learning and musical interpretation.

The mobile app is divided into three parts: The Musical Instruments Simulator, Musical karaoke (with musical sheets and different instruments) and beat machine.

The interface development and graphic elements was carried out by Portugal Multimedia, as well as all the development work in terms of programming and compatibility across operating systems.

Musical Instruments Simulator

It allows students to play and train, with virtual instruments, what they have learned in class.

The simulator is composed by the Orff instruments. They are the piano, xylophone, glockenspiel, triangle, tambourine, maracas, reco-reco, sticks and timbale.

 

It’s possible to interact with the instruments in two ways. In smartphones and tablets, the touch screen is used to play some instruments. Some other ones can be played through the recognition of movements. For example, it’s possible to play when shaking the smartphone, just like a maraca.

 

On the desktop, you can interact with the instruments using the mouse or the keyboard.

Musical Instruments Simulator
Musical Instruments Simulator
Musical Karaoke
Musical Karaoke

Musical Karaoke

It allows students to study and to explore the musical sheets and all the instruments used in the songs.

The karaoke is divided by levels, according to the book “Música Seis“. Each song, there are different instruments with the corresponding musical sheet, in the same track.

 

The controls allows the user to use karaoke easily and intuitively. Primarily play, pause, stop, forward and rewind. But not only. The user can increase and decrease the volume and the speed of the song. That way, it enables students to learn at a slower pace. The interface also allows the user to turn on or off each track, allowing the students to focus on the instrument they want to learn. In addition, it’s possible to see in which segment of the song you are in, and choose which part you want to practice.

Musical Karaoke

It allows students to study and to explore the musical sheets and all the instruments used in the songs.

The karaoke is divided by levels, according to the book “Música Seis“. Each song, there are different instruments with the corresponding musical sheet, in the same track.

 

The controls allows the user to use karaoke easily and intuitively. Primarily play, pause, stop, forward and rewind. But not only. The user can increase and decrease the volume and the speed of the song. That way, it enables students to learn at a slower pace. The interface also allows the user to turn on or off each track, allowing the students to focus on the instrument they want to learn. In addition, it’s possible to see in which segment of the song you are in, and choose which part you want to practice.

Musical Karaoke
Musical Karaoke

Beat Machine

It allows to create a beat in a simple and intuitive way, using the sounds of some Orff instruments.

Timbale, triangle, tambourine, reco-reco, maracas and sticks are the musical instruments that can be used to create a beat.

 

This part of the app lets you compose melodies, which can be easily edited throughout the composition process, turning off instrument or even changing the rhythm of each sound. It is also possible to change the beat’s overall speed.

Beat Machine
Beat Machine

UX / UI

The User Interface Design has been designed to allow better navigation and interaction with the app on different devices.

A good UI anticipates the user’s needs, in order to offer them an easy and intuitive user experience. Thus, we have developed a user-friendly interface, thinking of the youngest, who are the end user for this app.

Wireframes - App

A set of icons and graphics designed for the app.

All graphics in the app were created and developed by our team for this purpose. We follow the graphic line and colors of the school manual “Música Seis“.

Icons and Graphics

COLOR SCHEME

The color scheme respects the graphic identity of the project “Música Seis – Educação Musical 6.º Ano”.

The colors used in the app’s interface design were some of the ones that make up the palette of the manual “Música Seis“. The dominant color in the app, such as in the school book, is orange. The other colors were used in small notes, as in the menu of the musical instrument simulator.

color scheme
color scheme
color scheme
color scheme
color scheme
color scheme

ILLUSTRATION

The illustrations of the instruments followed a style that was intended to be more realistic.

The illustration was one of the stages for the development of this app. In the end, two proposals were developed. The first proposal followed a more minimalist line, with a more relaxed and colorful tone, in order to arouse the attention of the younger ones. The second proposal, approved by the client, was more faithfully to reality. Some of these instruments were even recreated in 3D in order to take on a more realistic behavior.

Final Illustrations

Initially proposed illustrations

Other projects

Did we get your attention?

Our next project can also be yours.