Archive for the ‘DJ21012 – Screen Based Interactive Media 2 (11/12)’ Category
-
Design is Key
Design is very crucial in trying to sell or encourage people to use your product. The design is usually the first thing users will see and before they read information about what you have made they will already have formed an opinion about your product. Therefore design is key!
I have made a design that will stay constant on all pages of my app. Here is what I have came up with:
This is just the base there will be extra at the top corners and bottom area for buttons. Here is an example of one button I made to go into the top left corner of the base design:
This would be a home button and I have made other buttons like this using the drawing effect to make it go with the theme of the table(background) and pencil(logo).
-
Taking Shape
Last week was an interesting week in class. I got to create my own diagram of content and transitions my app will contain. I also got to examine other peoples’ apps in class so that gave me ideas and got me thinking. Its always good listening to others opinions about design as you then understand what people like most and you can try and implement that into your ideas.I then moved on to design what the app will look like. I browsed many sites to try and get some inspiration. I loved a lot of designs but one that caught my eye was this app called Bills:
I loved the wooden background and that gave me an idea for the app I will eventually create. I have an image in my head of what it will look like I have put that down on paper. I have started to make a digital version of this design on Photoshop. I will post in the next blog of what my design looks like, along with the name I have came up with for the app.
-
Transition Thinking
Today in the studios our group talked a lot about transitions. We were figuring out how each page linked to each other when a button is clicked. We decided when on the home page we were going to have a sliding transition when clicked on any of the module tabs. The module page would slide from the right to left to become visible on the device. This transition would apply to any of the module pages when clicked on another module page. Another transition we decided on was a flip transition from a module page to the contact page. This would occur when the contact button would be clicked on in the any of the module pages.We also had some discussion about when on one of the module pages’ where would the home button be. Some in our group liked the idea of replacing the clicked on module button to turn into the home button. However me and a few others think the home button should stay constant in one position at the top of the screen. This way the user won’t accidentally click on the wrong tab.
We presented our project to the module leader and received positive feedback. I am very happy on how this app has evolved and would recommend designing the prototype on paper and doing wire frames as this shows you how the app functions clearly and will help you to code the final app.
-
Refine Refine Refine
Back in the studios last week our group evolved our Project Report App even further. We discussed what each page was going to consist like scrolling, buttons and gestures. We wanted the main page/home page to show a lot of information to begin with like a summary/average of every module inside many charts. One chart would show overall grade of modules and another chart showing attendance. There is also going to be a timeline so you can scroll along the timeline to show grades and attendance for all years of the course. At the bottom of the page there will be a tab bar with 3 tabs one for each module. When clicked on module one a new page will appear with more graphs about grades but in more detail. There will be a gesture in place where you can scroll left or right for more information/charts on attendance and reading material. At the top of each module page there will be a contact button which will have module leaders and tutors email address’.
The app is now taking shape in a new level from last time we met in the studios with gestures, buttons, page layout all in place. Next week will will look at transitions in more depth and we will have a fully finished wireframe of the Project Report App. -
The Beginning of Something Promising
The first week back from reading week the lecturer gave us a presentation of what the class was going to do for the next few weeks. We are to design an App that is relevant to a Digital Interaction Design student or simply a student at Dundee University.
We went into groups and discussed what our App was going to be about, what it does and who it targets. We started the design process by using sticky notes to write down many ideas and refine the ideas by grouping the ideas together until we got a structured app. My group generated 3 apps: one about planning and directing your uni life, this included a diary, deadline times, campus and building maps; another app that covered everyday uni life necessities such as a cookbook with recipes and a shopping list, social events going on in Dundee, money tracker and equipment you will need for uni; the last app was was called Project Report which gives you a report in a visual way such as a pie chart and shows you how you are progressing compared to the class by using your grades and attendance records.
All groups then presented their ideas and that showed us what people where thinking and gave us some tips. We also got encouraging feedback from the class and tutor especially about the Project Report App. We then went back looking at the design of this particular design and refined it further. We looked at each page and what transitions it should include. This is just the start and the next few weeks will be very promising. -
Pressure Project
At University I was giving a pressure project task to complete during reading week. The project was about creating an iPhone App that makes good use of gestures in Xcode. Gestures such as swipe and tap are extremely useful in interacting with your iPhone. I started researching app designs and looking at their information structures, layouts and colours.
Soon after I roughly sketched out layouts of each app page and thought about transitions and how they would all link. The app was originally about the Marvel comics movie The Avengers. However when I was doing the digital design part of the process I realised I did not really like this idea. I changed the idea to Michael Jackson’s Thriller Album. I did the same design process as before and then made Photoshop designs for each page and buttons.
I was pleased with the outcome of my app and that it made use of swipe, tap, shake and other gestures. The internet came in very useful for providing me lots of tutorials in Xcode. I would suggest to anybody creating apps to put your ideas on paper first before you start to code as you can easily change ideas and the quality of your app will reflect your design process.
-
Brief Introduction to Wireframing for an App
Fantastic video giving tips and pointers how to wireframe and design an app for a mobile device.
-
Example of useful Gestures
This is a really cool idea for an app. Say you are out for a jog or wanted to play music in your car without looking for individual songs in a long list, just use this Gesture Music App for quick and easy access to your favourite songs. This app uses gestures like swipe vertically to change the volume and swipe horizontally for skipping songs. Another handy gesture is the hold down on album artwork to stop the song from playing. This app is very useful for on the move instant music which makes very good use of gestures.
-
App Icon Design
We have all seen app icon designs and thought that’s a cool one. To achieve this look you have to give it an image that is related to the app itself. Apple is very good at choosing relevant and sleek icons for their apps. For example iTunes uses a blue circle with a musical note. Simple but it works and that is the look designers should try to achieve. Never do you see Apple use words or over complicate their designs. Firefox is another great example, its an image of the world (representing the World Wide Web) being surrounded by a fox. App icon designs normally work best if you can guess what the app does without reading any description.
App icon designs are extremely important as people may just judge your app on its front cover.
-
The Similarity between Apps and Clothes
Clothes are a necessity, everyday life activities are surrounded by them: shopping, having a quick jog, going to work, sleeping and so on. We decide which clothes are suitable for each activity we are about to take on and we inspect what clothes are worthy to be put on over our skin. Technology today has given us a new item of “clothing” with Apps. Apps dress up our iPhones and iPads with sophisticated designs and fancy gestures to make us look classy.
Apps don’t just look great they can perform everyday tasks. Going out to buy new clothes or DVDs doesn’t necessarily mean for you to leave your house for the shopping center just pick up your iPhone and press a few buttons and shazaam. Apps don’t just stop there they can record your performance levels while running, provide you with ultra fun games on a lunch break from work or become an alarm clock. The boundaries for Apps don’t seem to have any limits, just another part of modern day life.
Tags
Categories
- Assignment 1
- Assignment 2
- Assignment 3
- Assignment 4
- DJ21012 – Screen Based Interactive Media 2 (11/12)
- DJ22006 – The 21st Century Designer (11/12)
- DJ22011 – Interaction Design (media products) (11/12)
- DJ31035 – Interaction Design – Physical Digital Products
- DJ32005 – Design & The Market Part 1 (12/13)
- DJ32013 – Social Mobile Apps (12/13)
- IM11002
- Uncategorized
Archives
- April 2013
- March 2013
- February 2013
- January 2013
- November 2012
- October 2012
- September 2012
- April 2012
- March 2012
- February 2012
- January 2012
- December 2011
- November 2011
- October 2011
- October 2010
- September 2010