Infographic – Page 2 – Jasmine Pointer

Mobile Design Process

Jasmine Pointer / November 17, 2015November 23, 2015 / Infographic, Mobile Design, Multi-Format Data Visualisation, Project Two

To start off the mobile design I wanted a template to work around such as the iPhone status bar at the top of the phone. I did some research and found that the font used for this is Helvetica, so on Photoshop I started to create it myself. As well as the text that appears such as the time and battery percentage I wanted to add some icons, therefore I took a screenshot on my own phone and added them to my design. I then went on ‘layer’ and ‘flatten image’ and this gave me my mobile template.

I started my design by making a (very basic, but hopefully effective) logo for my app ‘infogram’

I used a font called ‘American Typewriter’ from dafont.com. Then I made the eye out of ellipses on Photoshop.

From here I started designing my app by adding shapes, text, colour – whatever I could think of that my app would need.

I knew I would be needing icons throughout my app design and therefore I went to www.flaticon.com.

I will design a home page, menu and a page which will show my own infographic.

Home page:
I have started by adding everything I could think of that would be needed on an app user interface including the logo, a sub-menu leading to a categories menu, an option to submit an infographic, access to your own infogram page (which would show all the infographics you have saved, liked, shared and submitted) and to sign in. I’ve also added a search bar which is clear and easily accessible as well as a most popular section to show a selection of infographics that could change every 10 seconds or so (my infographic would be shown here). Next I will add in imagery such as icons and some infographics for the most popular section which I have found on mashable.com. I chose the colour at random (sort of). I knew I wanted a pastel colour so I went on the colour palette and went through all the colours available and decided I liked this one best.

I’ve now added icons that I got from flaticon.com a well as infographics from mashable.com which has really made a difference and given it a finishing touch. I have also added ‘developed by’ text at the bottom to give it a professional touch. I’m not too sure about the layout of the ‘most popular’ section – the infographics appear stretched and you can’t really understand them. I will have to find a way to improve this.

Although I will be featuring infographics in the ‘most popular’ section, I am wanting to play around with this some more to see different ways of presenting them as at the minute it looks a bit odd and stands out too much.

Menu and Infographic Page:

I took the same approach with these two pages and started off with basic components and then added to them with icons to make it come alive. I have left space for where my own infographic would go and then there is the option to save, like and share it. Obviously I have used Helvetica throughout my design and I like the minimalistic feel it gives. However, it could appear lazy and boring to some, therefore I might play around with other fonts. I didn’t want to do this right now as I thought if I keep it simple it would make the process easier which it has, and trying new fonts might complicate the process. Now I have my app design near enough complete I can experiment with other fonts.

I’ve also made an icon for my app.

Icons made by Bogdan Rosu from www.flaticon.com is licensed by CC BY 3.0

Ideas…

Jasmine Pointer / November 16, 2015November 26, 2015 / Infographic, Multi-Format Data Visualisation, Project Two

Infographic

My infographic will simply inform the viewer on what the theory of relativity is, in the most simplest way (due to my own knowledge of it being limited). When this infographic is incorporated onto one of the other outputs I could make it interactive (or at least state that it will be) just by adding hyperlinks or animated elements and so on. Which leads me to…

Mobile Design

I had the idea of an app that holds thousands of infographics of all different kinds of subjects. Therefore I could create a homepage for it, categories menu, and a page for my own infographic. I went onto the app store on my phone to see if such an app already exists and it does but here’s what it looks like:

I want to create a design for an app much better than this one.

A2 Poster and Web Design

I’m still not 100% sure what to do with these outputs yet, so I am going to focus on the infographic and mobile design and hope that my ideas stem from those.

Infographics

Jasmine Pointer / November 8, 2015November 9, 2015 / Infographic, Multi-Format Data Visualisation, Project Two, Research

I have been doing some research into infographics so I could get some inspiration and ideas flowing. I’ve been looking at examples on www.customermagnetism.com/infographics/ which has a variety of different infographics to show.

I liked this one as it proved to me how effective infographics are by explaining very clearly what they are. I like the design and how it continues down the page – it shows that infographics can be very flexible in this way and don’t need to be a set size. The information displayed is minimal and yet useful – which shows me that I don’t need to go completely in depth with it. I can include quotes, statistics (displayed as graphs, charts, through imagery, etc), colour and images. I do like the style of this infographics, which has been presented in a grid fashion, but I think I would like mine to be less precise in this way. I will try grids but I would rather not use this layout. I have a colour scheme in mind, which I can see from this infographic is important to keep a balance and make the vast amount of information easier to read and comprehend.

I also had a look on this website – www.informationisbeautiful.net which gave me a good insight into different ways of displaying information so that it is visually pleasing but also how to make it interactive. For example: ‘Non-Fiction Books Everyone Should Read’ – this infographic names different book titles in a creative design and when you click on each title it leads you to a website where you can buy it. I won’t be able to do this myself, but I can always explain what the infographic would be like when online.

Existing ‘Theory of Relativity’ Infographics

I had a look at what infographics for the theory of relativity are already out there to see how I could make mine different but also to get some inspiration and knowledge. After googling ‘theory of relativity infographics’ I was soon able to pick out which I liked and disliked –

I really liked this infographic (<— click), which helped to explain the theory to me. It’s got a lot going on visually but in a good way that keeps you interested. I feel like the length of the infographic helps to spread out the information. As you cannot see it all at once it breaks it up a lot more and makes it simpler for the audience. The layout is split into sections which I like, but I also want to have a go and mixing the layout around and overlapping sections to see how this would look too.

I both like and dislike this infographic. I do like how you can see all of the infographic on your screen without scrolling down or across because it helps to show off the overall design involved such as the colour scheme. However, the colour scheme is one of the things I don’t like. It’s too dull in my opinion and the typeface used is very boring. I think this infographic was probably made for an older target audience and perhaps someone who is very interested in the subject, perhaps a physics student. It’s not the kind of style I would use in my own.

I can definitely say I don’t like this one as its just too plain and boring. The typeface is plain, simple, boring and dull. There is not a lot going on visually with very basic images. The colours do not allow anything to stand out. It makes the information as boring as the way it is presented which is not what an infographic should do.

Looking at these infographics has given me a good idea of what I want to do and what I definitely do not want to do. Now I need to research more into the theory itself so I know what information to present.