sadie seddon @sadieseddonviscom - Tumblr Blog

New account for level 5: https://sadieseddonlevel5.tumblr.com

Group evaluation

App recording

#there’s an app for that #visual communication in context 1 #app recording #XD #app design #app

App in context

#there’s an app for that #app #app design #mock-up #visual communication in context 1

Final prototyping and pages

We decided to use sleek and smooth transitions to match the design style. The transitions were easy to do as it was mainly linking everything to the menu and home page.

#prototyping #visual communication in context 1 #there’s an app for that

Alarm page and bus times page

I then desinged the alarm page. I experimented with different ways of laying out the different days of the week next to the alarms, but eventually settled for the widget type design again. I did some prototyping on this page too. I added a feature where you can click the alarm buton and make it appear like you are turning the alarm on and off. I did this by turning down the opacity in the toggle state.

This is the bus times page I made. I tried to make sure it fit with the rest of the app and so I designed it similar to the alarm page.

#app design #app #visual communication in context 1 #there’s an app for that

Home page

I designed the home page alongside the deciding of the colour palette, which helped us determine what looked good. My design style was inspired by our research; I went for a minimalist and rounded style, using bright colours and widgets. To add some more visual interest to the design, I created little illustrations such as clouds, a road and a clock. My illustration style was inspired by Headspace.

I desinged it so the bus time and bus pass were almost connecting, as they would be used togther. I also added a hello to the user to make the app feel warm and welcoming. Finally, I added the arrival streak inspired by Forest. I put this near to top so it is one of the first things you see.

#app design #app #Visual Communication in context 1 #there's an app for that

Deciding on a colour palette

We look at a lot of different colour palettes for our app. We first went with more earthy tones like browns to fit the planet theme, however we felt this didn’t match the app logo and wasn’t bright enough. We also looked at a blue toned palette and a more bright summery palette.

In the end we went for the purple, blue, green and pink palette as we felt it was cool and calm with its blue undertones, but still bright with a lot of white in the colours.

#colour palette #colour #app deisgn #there’s an app for that #Visual Communication in context 1

App logo design

Max designed the logo for our app. We decided it would be good to design this first as we could make sure the colour palette matched. We decided we liked the one with the green accents as it was a more abstract geometric impression of a planet, and introduced an accent colour.

#app #logo design #logo #Visual Communication in context 1 #there's an app for that

Font exploration

We first looked at using como as our font, as it is clean but rounded and soft. However, some of the characters looked funny, such as the A. We then looked at sofia pro. We liked this font, but it wasn’t rounded or soft so it didn’t match. Finally we settled on Sofia Pro Soft. We tested it with the logo and felt it fit well as it was softer.

#Typography #font #Visual Communication in context 1 #there's an app for that

Headspace and forest app research

We looked at Headspace which is a relaxation and meditative app. We really liked the use of widgets to click on in the app, as the rounded look was clean and simple, good for de stressing.

Headspace has a calm but bright colour palette. We felt it was important to have bright colours so it’s easy to identify and arrange stuff on our app with colours. The colours are bright but the hues and slightly softened/ the opacity is taken down. I really like this use of subtle hues in the appearance.

We also looked at the app forest, as in our feedback from the wireframing workshop Justin mentioned maybe using a reward system or streak in our app. The app rewards you for doing revision and grows a tree more and more every time you open the app. This is something we will use in our app.

#visual communication in context 1 #there’s an app for that #app research

App mood boarding

We made a mood board for our app design. I made a few annotations of parts we liked.

#app research #app #there’s an app for that #visual communication in context 1

Target audience research

We conducted a survey/poll in order to collect some data about our target audience. I used Instagram as my age range of followers is 81.6% 18-24, which was our target demographic. We asked questions to see if our app would actually appeal to the target audience. 80% of the people who answered the poll said they would. We also asked what kinds of thigs they’d want in a scheduling app. People said:

* To do list

* Wallet for bus pass

* Bus times

* Simple aesthetic look, sleek

* Change times and dates if they dont suit you in the plan

#research #target audience #survey #Visual Communication in context 1 #there’s an app for that

XD induction

In the XD induction, Ben showed us how to use the basic functions of the program. We created a website page and leanrt how tto create text and boxes, and then lay them out in line. We also learnt how to prototype different parts of the page to make them interactive. This Induction made me feel much more comfortable with the software as I had never used it before and I was unsure if I would pick it up easy.

#XD #XD induction #adobe #app design #Visual Communication in context 1 #there's an app for that

Wire framing workshop