digital media and app design

22
DESIGN FOR PRODUCTION SANGEETA JAIN

Upload: virtu-institute

Post on 12-Apr-2017

141 views

Category:

Design


0 download

TRANSCRIPT

Page 1: Digital Media and App Design

DESIGN FOR PRODUCTION

SANGEETA JAIN

Page 2: Digital Media and App Design

LECTURE 8 DIGITAL MEDIA/APP DESIGN

Page 3: Digital Media and App Design

Digital media is content (text, graphics, audio, and video) that is in digital formats and transmitted over internet or

computer networks.

The digital world includes computers, software, and the movement and storage of digital information via networks

and storage (hard drives and cloud services).

DIGITAL MEDIA

Page 4: Digital Media and App Design

•  Digital media has dramatically and dynamically changed the way of life today, the way we live, work, communicate, share, entertain and educate ourselves.

•  It has also opened up a vast avenue of digital advertising (also

known as online advertising). It is digitally displayed through the Internet, on smart phone and other hand-held devices.

•  Digital media is trans-disciplinary in nature which brings together

digital arts, technology, business strategy, human computer interaction, design and development in a meaningful and innovative combination that possibly can cater to a global society.

DIGITAL MEDIA

Page 5: Digital Media and App Design

•  Digital by default •  Push vs. Pull

–  content is "pulled" by the consumer, not "pushed" by the media.

•  Convergent –  separate technologies blend together in a common digital denominator.

•  Wired, Wireless, Terrestrial and Satellite-based –  configured for a variety of transmission methods.

•  Distance Insensitive –  can be assessed from any/every geographical location

•  Networked –  connectivity - one-to-many to one-to-some and one-to-one –  real time –  decentralized

•  Interactive –  responsive –  personalized - the tailoring of content in real-time on the website –  non-linear

CHARACTERISTICS OF DIGITAL MEDIA

Page 6: Digital Media and App Design

•  In January 2011, the American Dialect Society named “app” the word of the year for 2010. Being named word of the year also implies that the word is newly prominent. We may listen to the radio, read the news and or watch television shows more and more often on our mobile devices or to be more precise within an “app”. So…what is an app?

•  The word app is a noun, and it’s short for “application.” Application is a software

program…a special type of software program designed to be used online or run on mobile devices.

•  Most mobile devices are sold with several apps bundled as pre-installed software, such as a web browser, email client, calendar, mapping program and an app for buying music or other media or more apps. Some pre-installed apps can be removed by an ordinary uninstall process, thus leaving more storage space for desired ones. Apps that are not preinstalled are usually available through distribution platforms called app stores.

WHAT IS AN “APP”

Page 7: Digital Media and App Design
Page 8: Digital Media and App Design
Page 9: Digital Media and App Design

•  In 2007, Apple Inc. unveiled the Apple iPhone, which was the world's first advanced touchscreen smartphone. It's the first phone to have an operating system, the iOS, and by enabling apps to run on the phone, it had allowed cellphones to become the primary mobile device of use.

•  Apple App Store launched in July 2008, a year after the first iPhone was released. It had 500 apps and, to many, was a revelation. It also signaled the dominance of the native mobile application. 10 million applications were downloaded in the first weekend.

THE FIRST MOBILE APP

Page 10: Digital Media and App Design

APP DESIGN

Page 11: Digital Media and App Design

Designing an app starts with… •  A thorough understanding of the user •  A list of tasks that the user may often perform

–  user scenarios / interaction design / user interaction •  steps the user will take to complete a particular task •  alert and/or error messages to be included •  secure areas to be provided (if required)

•  Wireframes –  architecture of the app –  links and labels –  what will go on each page –  how it will all work together

PROCESS OF APP DESIGN

Page 12: Digital Media and App Design

The design stage which is also known as the FRONT-END DESIGN or User Interface Design involves: •  Visual Design

–  Logo –  Fonts –  Colors –  Layout –  Styling –  Look and Feel

•  In the design phase high-resolution Photoshop files are created that are mock-ups of what the app will look like.

•  Knowledge of operating systems, platforms, screen sizes and resolutions help to create a functional design.

PROCESS OF APP DESIGN

Page 13: Digital Media and App Design

Wire

fram

es

http

s://w

ww

.sm

ashi

ngm

agaz

ine.

com

/201

3/06

/ske

tchi

ng-fo

r-be

tter-

mob

ile-e

xper

ienc

es/

Page 14: Digital Media and App Design

•  The focus should be on simplicity and functionality. •  The content should take the whole screen.

•  Negative space should be user to bring focus to the content.

•  Typography needs to be visually pleasing and optimal for reading. •  It is absolutely essential for the user to know where they are or

which section of the app is active. This can be achieved by simply having 2 states of an icon or 2 different colors on the text links.

*DESIGN TIPS

The grey icon can be used when the page in inactive and blue when it is active.

Page 15: Digital Media and App Design

The little red dot under the cup indicates the active section on the navigation

Page 16: Digital Media and App Design

•  The style, colors and typography should be consistent. Ex: one consistent color to indicate interactive element.

•  Animations such as slide, scale and color transitions must enhance the user interaction and not distract them.

•  Sounds when played, they can transform a mundane action into an enjoyable experience. People can recognize the app without even seeing it by its sound however sounds are used minimally in an app. They need not have a continuous music playing in the background.

•  Last but not the least remember: app design is not just about one static page design (like in print), it's how you connect multiple screens to create an interactive experience.

*DESIGN TIPS

Page 17: Digital Media and App Design

Then comes the process of building the app which is also known as DEVELOPMENT or BACK-END DESIGN is done by the developer and includes the following: •  translating the design into a working app

–  scripting and coding: building the design –  testing it: usability testing and quality assurance –  making it go “live” or launching the app or distributing it –  social network integration: allowing users to access, publish, share

information –  server-side logic: customizing the user experience –  user management: managing authentication, security and access control

•  It helps as a designer to know the basics of development process and/or the basic terminology used by the developers in order to design effectively and accurately.

PROCESS OF APP DESIGN

Page 18: Digital Media and App Design

SCOPE AND LIMITATIONS

•  The benefits of an app are as follows: –  Build a brand:

•  Apps provide valuable brand awareness and higher visibility.

–  Improve customer engagement: •  Apps give easy access to brands anytime, any place.

–  Create a direct marketing channel: •  Apps allow businesses to connect instantly and directly with the customers.

–  Reduce cost: •  Apps reduce the cost of papers, newsletters, staff etc. for businesses.

–  Real time content: •  Apps can regularly deliver new and targeted updates in real-time thus users

are kept up to date with the latest information and resources available.

Page 19: Digital Media and App Design

Simone Eyles Wagga Wagga is the home of an award-winning app that allows users to order coffee from a café with their mobile phone. Since launching in 2011, the app created by the startup called 365cups has been used to place 740,000 orders worth almost $5 million. Read more @ http://www.wonnsw.com.au/case-studies/2016/7/4/simone-eyles

Page 20: Digital Media and App Design

Benefits of using mobile apps. Base: Mobile apps users.

Source: ACMA-commissioned survey, May 2013.

Page 21: Digital Media and App Design

SCOPE AND LIMITATIONS

•  The limitations of an app are as follows: –  Storage space:

•  Since mobile devices has limited amount of storage, it creates limitation in installing and using apps.

–  Privacy and Security: •  When downloading applications, users possibly have to allow the publishers

to track and analyze their actions. This may cause to the loss or abuse of personal information.

–  Connectivity: •  If the internet goes down or is slow the user cannot access the app.

–  Distractions: •  It is easy to get distracted with the apps being integrated with social media.

Page 22: Digital Media and App Design

•  https://en.wikipedia.org/wiki/Mobile_app

•  https://en.wikipedia.org/wiki/Digital_media

•  http://www.wonnsw.com.au/case-studies/2016/7/4/simone-eyles

RESOURCES