UI design for memo app

UI design

프로토타이핑툴을 이용하여 Usability test까지 완료후,
사용자들이 제시한 의견을 분석하고 보완및 수정하여 
대략적인 인터페이스를 디자인해보았다.

 

만들어진 UI 디자인으로 다시한번 사용자 테스트를 진행해야 할것같다.
조사후에 보다 자세한 디자인 작업이 들어가야 할것 같다.
하나하나 모든 팝업까지 완성하진 않았지만 앱 인터페이스의 큰 틀을 잡았다. 사용자들이 제시했던 누구나 알 수있는 보기쉬운 아이콘과 화면구성으로 디자인했고 다른 장식없이 심플하게 인터페이스를 구성함으로써 효율성을 극대화했다. 사용자들이 사용하고 싶게끔 만들
매력적인 요소도 더 많이 생각해보아야 겠다.

Usability test results for memo app

script

안녕하세요~
저희는 중앙대학교 학생입니다. 수업시간에 새로운 어플리케이션을 개발중인데,
상용화되기전에 일반 사용자님들을 대상으로 저희 앱의 문제점을 찾고자합니다.
저희가 사용자님을 테스트하는 것이 아니니 부담갖지마시고,
편안한 마음으로 도와주시면 감사하겠습니다.
기록용으로 촬영을 할 것이나 저희 어플리케이션의 문제점을 찾는것에만
사용할 예정이니 양해부탁드립니다.
사용하시면서 드는 생각을 크게 말씀해주시면서 진행해주세요

과제1: 3월 24일에 스케쥴(‘인터랙션디자인')을 입력하고 저장해보세요
과제2: 메뉴에 관심사설정에 ‘음악' 카테고리를 추가 후 확인하세요
과제3: 추가된 음악 일정을 인터넷으로 검색해보세요
과제4: 초기화면으로 돌아가서 추가된 일정을 확인후  AM '08:00’ 알람을 설정해보세요
과제6: 모든 메모를 다른사람이 볼 수 없도록 잠금장치를 해주세요

•나중에 이 앱이 출시된다면 사용하시겠습니까, 사용하지않으시겠습니까?
•앱을 사용하면서 추가하거나 삭제하고 싶은 부분이 있습니까?
•가장 좋았던 기능과 가장 좋지 않았던 기능은 무엇입니까?

참여해주셔서 감사합니다.




우리가 만든 프로토타이핑툴이 사용자들에게 어떻게 쓰여지는지
또, 어떤점이 불편하고 맘에드는지 알아보기 위해사용자 조사를 실시하였다.

* 사용자 평가

- 평범한 앱인것 같다. 

굳이 이 앱이아닌 기존에 사용하던 다른앱을 계속사용할것 같다.

* 좋다고 생각된 기능

- 따로 나가지 않고 어플내에서 바로 인터넷 검색이 가능한 점.

- 각각의 스케쥴에 암호설정이 가능한 점.

- 관심사 설정기능과 그에 따른 정보 업데이트가 가능한 점. 

* 좋지 않았던 기능

- 딱히 좋지않았던 기능은 없었음.

- 이 앱에서 알람기능이 필요없을것 같다. 

휴대폰에 기본으로 장착된 알람 기능만으로 충분할것 같다는 의견이 있었다.

* 제시된 문제점

- 아이콘이 모두가 한눈에 알아볼 수있는 모양이었으면 좋겠다.

아이폰 사용자와 안드로이드폰 사용자간의 아이콘 통일

- 기존의 사용하던 스케쥴러 앱을 대신해 이 앱을 사용할만큼의 이 앱만의 특출난 매력이 없다.

* 후기

- 사용자 조사전에 최대한 완벽한 인터페이스를 구축해놓기 위해 신경을 많이 썼다. 

사용자의 입장이 되어 아이콘의 모양, 위치등 사소한것 하나하나를 배치해보고. 어떤 기능이 있으면 좋을지 사전조사도 충분히 실시했었다. 철저한 준비때문인지 사용자 조사전엔

은근히 자신감이 있었다. 이 정도면 별 무리없이 사용자들이 사용할 수 있겠지라는 생각까지했었다. 하지만 사용자들에게 직접 만져보게하고 사용을 시키니 놓쳤던 문제점이 발견되기 시작했다. 크게 문제삼지 않았던 아이콘의 모양조차도 아이폰 유저와 안드로이드 유저간에 인식이 달랐다. 이렇듯 사용자 조사의 횟수가 많으면 많아질수록 우리가 놓쳤던 부분들이 보이기 시작했다. 대부분의 사용자들이 긍정적인 답변을 해주었다. 하지만 질문 스크립트가 그런쪽으로 유도하지는 않았는지 의심해볼 필요가 있겠다. 영상에는 잘 담기지 않았지만 현장에서 사용자들의 표정, 머뭇거림등을 기록해놓았기 때문에 수정하는데 많은 도움이 될것 같다.

Usability testing video for memo app

Prototyping for memo app

메모앱 프로토타이핑 제작과정


전체적인 인터페이스 구성과 흐름 설정
​ 기존 앱에 '관심사설정', '잠금', '알람','위치기록' 기능을 추가해보았다.
'관심사설정' 기능은 본인이 선택한 관심사에 관한 전시, 공연등의 일정은 스케쥴러에 동기화 시킬 수 있는 기능이다.
동기화 시킴으로써 관심사에 대한 정보를 스케쥴러에서 받아 볼 수 있고, 따로 앱에서 나갈 필요없이 앱내에서 인터넷을 구동시켜 관심정보를 검색할 수 있게끔 한다.
'잠금'기능은 기존 메모앱과는 다르게 일정이나 메모 하나하나를 잠금설정 할 수 있다.
'알람'기능은 동기화된 관심사 정보나 본인이 설정한 시간에 알람기능을 설정할 수 있다.
'위치기록' 기능은 메모만으론 잘 기억되지 않는 내용을 보완하기 위해 추가했다. 단순한 메모를 '위치기록기능'과 함께 사용하여 보다 효과적으로 메모의 기능을 발휘할 수 있게끔한다.

보다 실제적인 앱 사용과 비슷하게끔 만들기 위해
제작중에도 계속 수정하며 프로토타이핑툴 제작을 두번 실시했다.

프로토타이핑툴 제작과정을 통해서 앱이 어떻게 만들어지는지 대략전인 흐름을 이해할 수 있었다. 많은 기능이 없는 평범한 앱이라도 하나하나의 디테일이 요구된다는 사실도 알 수있었다. 사용자의 입장에서 앱을 만드려고 최대한 노력했고, 불편함을 최소화하고자 했다.

Survey results for Memo App

[App for abandoned dogs] Usability test

Script for usability test

안녕하세요
제가 새로운 어플리케이션을 개발중인데,
상용화되기전에 일반 사용자님들을 대상으로 앱의 문제점을 찾고자합니다.
제가 사용자님을 테스트하는 것이 아니니 부담갖지마시고,
편안한 마음으로 도와주시면 감사하겠습니다.
기록용으로 촬영을 할 것이나 저희 어플리케이션의 문제점을 찾는것에만
사용할 예정이니 양해부탁드립니다.
사용하시면서 드는 생각을 크게 말씀해주시면서 진행해주시면 감사하겠습니다.

Task 1: 서울시 동대문구를 검색하여 고양이 메리의 정보를 페이스북에 공유하세요.
Task 2: 서울시 중구를 검색하여 강아지 해리에게 5만원을 익명으로 후원하세요.
Task 3: 강아지 해리를 입양하세요.

•나중에 이 앱이 출시된다면 사용하시겠습니까, 사용하지않으시겠습니까?
•앱을 사용하면서 추가하거나 삭제하고 싶은 부분이 있습니까?
•앱에 대해 하실 말씀이 있으시면 편하게 얘기해주세요.

참여해주셔서 감사합니다.

 <Tester 1>

  <Tester 2>

Tester 1은 task들을 잘 수행하였고 나중에 이 앱이 나올시 사용한다 하였으며 다른 코멘트는 없었습니다. 

Tester 2는 가족찾기에 들어가서 검색해야되는것을 찾지못하고 어려워하였습니다.

카드 결제창에서 머뭇거렸었는데 나중에 테스트가 끝나고 물어보니 

익명으로 후원하기인데 왜 카드결제인지 이해가 되지않았다고 했습니다.

익명으로 후원하기란 다른사람에게 알려지지 않을뿐 결제를 위해 정보는 필요하다고 설명해드렸습니다. 나중에 이 앱이 나올시 사용하겠다하였고 이유를 물었을때 '쉽게 좋은일을 할 수 있어서'라고 답하였습니다. 앱에대해 편하게 말씀하라 했을때 처음 메뉴에 동대문구의 누구를 찾으라 했을때 주소를 먼저 찾을 생각을 하여서 헷갈리는 부분이 있었다고 말씀했습니다.

문제점과 해결책

가족찾기가 정확히 무슨 기능인지 헷갈림 --->좀 더 명확한 단어선택이 필요할듯함

익명으로 후원하기에서 결제시 익명처리는 어떻게 되는건지 설명이 없음 --->익명으로 후원하기에 대한 부가설명이 필요함

[App for abandoned dogs] Paper prototyping

아이디어 피드백에서 기능이 너무 많다는 점을 수정하여
자료실과 커뮤니티 기능은 빼고 주요 기능인
입양기능, 후원기능, SNS 공유 기능만 남겨두었습니다.

[App for abandoned dogs] Idea

Idea

인터넷에 강아지 입양을 치면 미국은 유기견 입양 사이트가 제일 먼저 뜨는데 

한국은 펫샵 분양 사이트가 제일 먼저 뜹니다. 

유기견,유기묘 입양 사이트는 따로 '유기견' 으로 검색해야 들어갈 수 있습니다. 

그리고 입양하고싶은 유기견,유기묘들을 찾으려면 여러 사이트를 들어가야하고 

신청방법도 제각각입니다. 그래서 유기견 유기묘 입양 어플리케이션을 만들어 정보를 

한군데로 통합해서 입양자가 원하는 견묘를 쉽게 찾을 수 있게하고 

입양되길 기다리는 견묘도 하루빨리 좋은 가족을 찾을 수 있게하려는게 

이 어플리케이션을 제작하려는 의도입니다. 

큰 메뉴는 가족찾기, 자료실, 커뮤니티로 나눠져있습니다. 가족찾기에서는 입양 가능한 견묘를 강아지 고양이로 구분하여 감색할 수 있고 연령별 지역별로 검색할 수 있습니다. 검색 후 마음에 드는 사진을 클릭하면 더 자세한 정보를 얻을 수 있고 SNS로 공유하여 다른 사람들에게 알릴 수도있고 상의할 수도 있습니다. 그리고 해당 견 혹은 묘에 후원하기와 입양하기 중에 선택할 수 있습니다. 후원하기를 선택했을경우 원하는 금액과 익명으로 하길 원하는지를 선택할 수 있고 선택완료시 결제창으로 넘어갑니다. 입양하기를 누를시 입양양식을 작성하게됩니다. 자료실에 들어가면 입양에 관한 정보와 애완동물 기르기에, 건강,훈련 등에 대한 정보를 얻을 수 있습니다. 동물보호단체의 연락처도 한군데에 모아놓아 연락하기 쉽게하였습니다. 커뮤니티에서는 입양한 유기견,유기묘를 소개할 수 있고 서로 정보 공유도 할 수 있는 입양자들을 위한 자유로운 공간입니다.

Feedback for this idea

아이디어와 방향이 예전보다 좁아져서 좋다.

가장 큰 이슈가 무엇인지 분석하고 그에따른 솔루션을 찾아라.

문제점을 분석하고 인터뷰를 해봐라.

기능이 너무 많다. 우선 가장 중요한 기능 분석 후 시작하라.

유기견을 할지 유기 반려 동물로 할지도 생각해봐라.

After feedback

유기견을 쉽게 못찾는게 문제라기보단 유기견이 너무 많고 일반 펫샵에서 거래되는 애들의 문제도 많고 (가둬두고 새끼만 계속 빼는 어미견들에서 나온 새끼들이고 2개월 이전의 애기들을 팔아서 면역도 안생긴 상태에서 어미와 떨어져 병에 잘 걸리고 생일을 속여서 파는 불법행위가 이루어지고 있습니다. 어미견들과 어린강아지들의 보호가 필요합니다.) 근데 유기견 홍보는 많이 하려하는데 사람들의 인식은 잘 바뀌지않습니다. 강아지를 입양하고 싶을때 검색을 했을경우 뜨는 정보가 다 펫샵이다보니 유기견을 입양할 수 있는것도 모르는 사람도 많으니 입양 및 후원을 장려하고싶은 마음입니다.

안락사 공고가 얼마 남지 않은 급한 강아지들 위주나 나이 많은 강아지나 아예 어린강아지들(사회성을 기르기위해 필요함) 이런 특정한 애들을 위한건 어떨지.. 아님 임시보호라고 애들을 맡아서 임시로 보호해주는건데 애들 사회성 기르기위해서 사람들과 친밀감 기르기위해 또는 치료가 필요한애들 등 집으로 임시보호 가면 애들 표정도 달라지고 건강상태도 좋아져서 입양도 잘가는편이라 임시보호도 필요한데 임시보호가 필요한 애들을 위한 앱은 어떨지싶습니다.

Feedback

급한애들위주로 해주는것도 좋다. 사람중심이면 검색이 위주겟지만 동물 중심 사용자디자인 이면 급한애들 위주가 더 맞겟다. 하지만 인간 사용자도 고려해야된다. 동물들 위주로 기능도 좋은데 결국 실 사용자는 인간이기 때문에 둘 다 고려해야한다. 그렇지않으면 급한애들 위주로 올려놔도 사용자가 사용안하면 소용이없다. 같이 진행할건 인식을 바꾸는게 중요할듯하다. 사람들의 인식이 지금 어떻고 어떻게인식이 잘못됏는지 어떻게 고칠수 잇는지 리서치를 더 하길 바란다.

 

 

Why build a native mobile app rather than a HTML5 web app?

Why build a native mobile app rather than a HTML5 web app?

This is a question we have been asked many times
over the years and doesn’t seem to be going away. Given the benefits of
HTML5 why not just develop in this format rather than fully native
separately for iOS and Android? Even when we started developing native
apps we were being told that native apps would quickly be made redundant
by HTML5, yet here we are 4 years later with a growing demand for
native app development.

HTML5 is a brilliant way of creating graphically rich, intuitive
applications that can be restructured remotely and deployed on multiple
platforms. However if you think that is the end of the debate then your
would be very wrong; The advent and the widespread use of smartphones
has sparked the development of fully native apps, written platform
specific using the API’s provided by the system. Native apps provide a
level of user experience, performance, monetisation and security not
available though an HTML, browser based web-app. Native app developers
have access to as many as 7000 device capabilities and to features such
as the camera, location, contact lists, calendar, near-field-communication 
and local memory to a far greater degree than is possible by HTML5.

Speed
A considerable benefit of native over HTML5 is speed. A native app
doesn’t have the added overhead of having to download the design layer
in addition to its content, it can concentrate on only downloading the
data for the app. In addition much of this content can be cached and
used offline or used whilst the latest data is being downloaded in the
background. As a result native apps load faster regardless of the
strength of your internet connection.

Marketing
One final benefit that is often overlooked in this debate is the
marketing benefit of a native app; the home screen on a person’s
smartphone is a very valuable piece of real estate for a brand. If you
can get your brand on a person’s phone, then they are viewing it many
hundreds (even thousands) of times a week. It is our view that a native
app installed on someone’s phone has huge marketing value to a brand.

Numbers speak
According to aMarch 2013 Compuware Survey, around 
85 percent of mobile professionals showed preference  
for mobile apps over mobile websites. 
This was attributed to the richer user experience that native apps generate. 

Most of the apps we produce are given away in the app stores for
free, but a number are paid for apps. According to numbers presented by
this year’s Canalys report, the combined income of native developers stood 
at $2.2 billion for Q1 2013. The picture is in stark contrast to the other side with the report suggesting that the monetisation was zero for developers who were creating HTML5 applications. 

So there we are, we’re stuck on native apps, we love them and see
that they are here to stay. If you’d like to talk more with us about a
native app for your brand/company then please get in contact with us.

http://www.brightec.co.uk/blog/why-build-native-mobile-app-rather-html5-web-app 

Web Sites vs. Web Apps: What the experts think

By Ciprian Borodescu

The term “web app” has been around for the past years – we’ve all heard it and used it more times than we care to remember. Yet there remains a debate on where “web sites” end, and “web apps” begin. Guest author Ciprian Borodescu presents the opinions of several prominent figures in the web technology domain and discusses the ‘app-ification’ of the web.

Definitions of web sites vs. apps

Web sites are so deeply embedded into our daily culture that it is impossible to imagine life without them. Even as a developer, I find it hard to remember the times from my childhood when my chubby little hands didn’t yet know how to type. In the last two decades, the Internet has grown, expanded, exploded and became impossible to ignore, making any keyboard without an Internet connection pretty much useless.
In the last few years, the web brought with it a new term that can be exciting and confusing at the same time: “web app”.
But what is a “web app”, how does it differentiate from a “web site” and why does it matter?
Understanding this difference ultimately makes us better users or developers? Is a business going to blossom just by marketing its online presence as a “web app” instead of a “web site”?
To figure out the boundaries between websites and web apps, I interviewed several prominent figures in the web technology domain who contributed with their experience and professionalism to help guide the debate: Dominique Hazael-Massieux (Mobile Web Initiative Activity Lead at World Wide Web Consortium), James Pearce (Head of Developer Advocacy at Facebook), Michael Mullany (CEO at Sencha), Christian Heilmann (Principal Developer Evangelist – HTML5/Open Web – at Mozilla Corporation) and Stephen Pinches (Head of Learning Technologies – ELT at Pearson plc and Group Product Manager – Mobile & Emerging Platforms at Financial Times). In this article I pieced together their expert input to help answer the web site vs web app debate.

The difference between Web sites and Web apps

In the pre app store era, the word “applications” had been applied to Web sites that provided advanced user interactions and capabilities previously available only through installable software. Early examples of web applications include Webmail, Google Maps and Google Docs. Compared to the classic web, i.e. blogs and news sites, web apps provided a richer user experience and access to advanced browser capabilities.
Today single-page web sites might still be referred to as web apps, but it’s more about the task focus than the technology itself. From this perspective, as Christian Heilmann explains, “The use case of an application is always to DO something with it”.
The task centricity of web apps is easier to understand if you think of smartphones or tablets: an app’s purpose is to achieve a specific task, like making a call, checking your email or finding a taxi nearby.
Some may argue that we can simply classify Web sites as being read-only and Web apps as being read-write. That certainly seems simple enough: Web sites are for consumption what Web apps are for creation. Does it sound right?
For developers, it is easier to draw the line between web sites and web apps if we think of the technical distinctions. Web apps have some defining attributes that bring them closer to their native counterparts:

• self-contained
• rich/interactive user interface, possibly mimicking the native UI of the device
• using advanced device capabilities – like geolocation, camera integration, or other technologies that the W3C Device APIs and Policy Working Group is developing
• action-oriented rather than information oriented
• not relying heavily on (or hiding when possible) the browser chrome (back button, reload button, address bar)
• working off-line, for example using HTML5 ApplicationCache, localStorage, or indexed database

Mozilla’s Christian Heilmann argues that the offline attribute is not a technical necessity in terms of definition, but rather a crucial usability distinction:
“Seeing how flaky our connections are – I am writing this on a plane – our apps should make people as effective as possible and this means we shouldn’t be dependent on a connection. The interface should be usable whilst we are off the grid and sync as soon as we go online”.
But how can we explain the difference to non-technical users? And, do we need to?
According to Dominique Hazael-Massieux, a Web site can be presented as a Web app as long as users consume it in a similar way they do a native app. If it’s exposed as an iconified app and used for a specific task, it shouldn’t matter whether it’s contained in the browser or installed via an app store. Facebook’s James Pearce outlined a few possible vectors that need to be considered when differentiating between Web sites and Web apps. I‘ve summed up his arguments:
Creation versus Consumption. Pearce asserts that read-only interaction should be classified as a site, but this criteria is not sufficient to distinguish between web sites and web apps. We still have cases like Flipboard (clearly oriented towards consumption) or Twitter and Facebook (with entirely user-generated content) that do not fit in any box.
Linkability. Since both web sites and web apps can be launched by entering a URL into a browser or from a home-screen icon, this is clearly “not a reliable way to distinguish between web apps and web sites” according to Pearce.
User Experience. Visual pizzazz is an important argument, one that users might particularly relate to, but is also a fuzzy boundary. What if my site displays a fixed toolbar, but no back button? What if my list appears as hyperlinks instead of ‘tappable’ items? What if I use plain scrolling instead of smooth fancy bars?
Architecture. In the case of single page webapps, is SEO the price to pay when choosing to give the browser far more autonomy and responsibility and take advantage of its HTML5 APIs like storage? Do Web sites have SEO capabilities while Web apps don’t? We are back to explaining the differences between the two by using technical terms.

Should you be building web apps or web sites?

This question might be regarded as a technicality with a pinch of marketing to spice it up. This reminds me of the “HTML5 is ready” contest by Sencha that was announced a few months back, encouraging developers to draw inspiration from native apps and create similar web apps that show off the capabilities of HTML5.
The creators of the competition correctly argued that “the mobile web is the most fertile ground for leading edge web development because it doesn’t have the legacy of the older internet explorers that the desktop does. You can start your development with the assumption that your app or your content will be used in a fairly recent browser, so you can take advantage of a whole host of features like Canvas, inline SVG, HTML5 video, CSS3 styling etc. that bring the experience alive for the user”, as Sencha’s Michael Mullany explains.
Would it be safe to argue in favor of building web apps instead of web sites especially on mobile? Mobile users perform specific tasks on their devices, so a web app that offers the same experience as a specialized native app might gain more interest compared to a regular website.
Long term the distinction should not matter. According to FT’s Stephen Pinches, it really doesn’t make any sense, on the long term, to speak about the future of the mobile web: “there shouldn’t be “mobile” and “desktop” but simply good, user-centered design, which adapts and responds to the screen size and features of the device upon which it is displayed. However, on short to medium term, there is a need to differentiate and ensure the user experience is as good as possible on a given device.”

The ‘app-ification’ of the Web

Whatever your preference may be, there is an increasing number of mobile developers targeting web apps. Based on VisionMobile’s latest Developer Economics survey of 6,000+ developers, already 23% of HTML5 mobile developers develop web apps, compared to 38% who develop mobile websites.
With browsers increasing support for device APIs, and with a growing number of developers going direct to native with PhoneGap, Icenium or Appcelerator, or even with the recently launched Firefox OS, the web world is clearly moving in the direction of apps.
As Sir Tim Berners-Lee said in 2012, “the solution is in your hands: develop web apps!”

http://www.visionmobile.com/blog/2013/07/web-sites-vs-web-apps-what-the-experts-think/ 

[article] How to create your first iPhone app

Since the iTunes App Store launched in 2008, over 500,000 apps have been approved by Apple, and thousands more app ideas are scrawled on napkins across the world every day. But question remains, how can a person with limited technical skills create an iPhone app? 
The good news is anyone can make an iPhone app, it’s just a matter of knowing the series of actions you need to take to make it happen. Be sure to bookmark this article because it will serve as a guide for learning the process for creating your first iPhone app, going step by step from idea to the App Store.

What Is Your Goal?

The first thing to look at when embarking on any product development or entrepreneurial venture is your goals for the project. Having a vision of what you want to achieve at the outset is an important barometer that will confirm whether the development process is heading in the right direction.

Let’s look at an example. Jim is an “idea person” who wants to create an app that brings in passive income but that doesn’t require him to quit his day job. Jim understands that to achieve this goal, he will need to employ others who can do the work of updating the app, fielding customer questions, responding to feature requests, etc. If Jim hadn’t defined this goal in advance, it’s likely that he:

• would not have planned in advance to hire help,
• would be unhappy with the time commitment required for him to take on the work personally.

Whether you’re an individual like Jim, a marketing director, or an IT professional creating apps for internal use, having a project goal will help make your app development process a success.
Here are some examples of project goals:

• Create an app that doesn’t require hands-on day-to-day management.
• Create an app that becomes a full-time business for me and a team.
• Create an app that promotes my existing product or service.
• Create an app that is purely for fun and not for profit.

Action item: Write down the goal you hope to achieve by creating this app.

What Are Your Expectations?

When I consult with people who have ideas for iPhone and iPad apps, the question they most frequently ask is, “How much can I expect to make?” Unfortunately, this is difficult to answer. The following factors are unique for each application:

• Cost to produce,
• Popularity,
• People responsible for managing its success.

All of these factors contribute to the financial success of your app. Base your expectations on this knowledge and on the documented proof that a wide variety of people are making profitable apps every day:

• Non-technical “idea people” and entrepreneurs such as the Gabi founders;
• Independent developers such as Lima Sky and Driftlab;
• Educators such as Montessorium;
• Writers such as Sarah Young;
• Mid-size entertainment companies such as Electronic Arts and Zynga;
• Large sports and entertainment companies such as MLB and Disney.

Realistic revenue projections will be different for each app, but here’s an example:

ABC application will show a profit of 10% in the first 60 days after launch, based on the success of XYZ application, which has a similar user base and functionality.

Individuals and companies alike are creating apps to solve problems and to entertain, and yet the process of making apps is still cloaked in mystery. Next, we’ll look at what goes on behind the scenes of an app’s creation and give you a step-by-step process for making your own idea a reality.

Where Do I Begin?

Good advice on where to start is different today than it was two years ago, when you could launch an app without much promotion and still have a fair shot at getting seen. Today, App Store competition is fierce, and dozens of new high-quality apps are being launched every day. This competitive environment means that ideas must be evaluated and refined to achieve maximum success in the App Store.
Have your idea evaluated.
“Evaluating” anything in which you are not an expert is difficult. For example, if someone had an idea for an innovative design for a child’s car seat, would that person be qualified to evaluate their own idea? Probably not. They would need to seek out the advice of someone who knows the child car seat niche. That expert would shed light on how to make the idea even better based on their specialized knowledge of the industry.
The app world is no different, and a variety of people are qualified to evaluate ideas:

• iPhone app marketing professionals
  These people have specialized knowledge of how their clients’ apps have performed in the App Store, as well as of promotional techniques that do and don’t work.
• iPhone app developers
  Many successful indie developers are committed to serving their community. If you humbly approach these folks for advice, in my experience most are more than happy to help review your idea.
• Personal connection
  Do you know someone personally who has created and launched an app? Take them out for lunch and have them give feedback on your idea.

What will an evaluation do for me?
When you get an expert opinion on your idea, you find out the following:

• Whether the product will have competition that will be tough to beat;
• Whether the idea has any technical limitations;
• How to take a phased approach to the development process;
• Whether you can refine the idea in other ways to increase sales opportunities;
• Whether the idea could be profitable based on your ballpark estimate of production costs;
• Whether the idea is a good fit for the mobile context;
• Whether your target audience could provide useful feedback on the idea.

This is the type of information you want to gather from an expert reviewer. Once you’ve met with someone who can give you this kind of feedback, you can move on to the next steps of the project with confidence in the viability of your idea and that your goals can be met.
What if I can’t find someone to evaluate my idea?
If you’re having difficulty finding an expert to provide an opinion on your idea, ask yourself whether these success factors apply to your app:

• Does your app solve a unique problem?
  People want to be able to do a lot of things while on the go. Successful apps often solve a problem that is unique to the mobile context.
• Does the app serve a niche?
  Find a niche with ardent fans (pet lovers, for example), and create an app that caters to it.
• Does it make people laugh?
  This is a no-brainer. What happens with funny apps? They get shared — a lot.
• Are you building a better wheel?
  Are there existing successful apps that lack important features or design elements? This is tricky because those developers might already be working on such enhancements. But if you get to market first, you have a good shot.
• Will the app be highly interactive?
  Let’s face it: most of us have the attention span of a flea. Successful games and utilities engage the user by requiring a lot of fast-paced interaction.

Action item: Have your idea evaluated.

Step 1: Develop A Monetization And Marketing Plan

“Wait a second, aren’t we supposed to be drawing prototypes and stuff?” Actually, not yet. The next step before moving into any kind of design or development is to figure out how your idea will generate a profit!
“Why is this so important? Can’t I do it later?”
You could, but AppPromo surveyed 102 developers and announced in its report that:

80% are NOT generating enough revenue with their app to support a standalone business.

It’s fair to assume that a great portion of that 80% also didn’t develop a monetization or marketing plan prior to developing their app. Read tap tap tap’s blog to see how companies like it do their homework. The results speak for themselves:

Here’s what you have to look forward to if you do not consider monetization strategies before developing your app:

“OMG I’ve got this great idea!”
Sketch, sketch, sketch.
Design.
Develop.
“I think I’ll charge 99¢. See how that goes.”
Launch. “Woo hoo!”
“Uh oh. Why aren’t people paying 99¢?!?”
App plummets into App Store black hole.
“Maybe I should make it free?!?”
“Crap! Where’s my developer? I need to fix the app, change the way it makes money, because 99¢ isn’t working!”
“OK, the app is fixed, with a new way to make money. How am I going to get my ranking back up?”

Not pretty, but a very real scenario. If you want a step-by-step guide to avoiding the chaos of a pricing disaster, consult my “App Monetization Guide.”
Action item: Develop a monetization plan.

Step 2: Sign Up For A Developer Account

Even if you will be hiring out the development work, you will need to establish your business within the App Store. To do this, visit the iOS Development Center, and sign up for an account. It’s $99 for a year and requires that you provide the tax and bank account information of your business or yourself. Have this information handy before signing up.

 

The only reason not to sign up for a developer account would be if you’re OK with having your app published under another person or company’s account and brand. If that is the case, then know that Apple would pay all revenue to the account holder’s bank account. That account holder would then be responsible for paying you.
Action item: Open an iOS developer account.

Step 3: Sketch Your Application

If you have an idea already, then you likely have some visuals in mind for how the app would look and work and the information it would present. You don’t have to be an artist to sketch a rough interface, so start putting your ideas down on paper. Before you begin, ask yourself:

• What primary action will users take within the app?
• What information will each screen need to present?
• What is the flow? How will users get from start to finish?
• How big should the elements on screen be relative to each other?

You may find during this process that some fresh ideas come to mind that simplify the flow or that add a creative twist to the interaction design. Try to keep your original concept in mind without blocking the flow of new ideas!
Create at least one thumbnail sketch for each screen in your application. Experiment with various navigational schemes, the copy on buttons and the flow between screens. If you want to transfer your sketches into digital format, iPlotz is a good tool to check out.
The purpose of sketching your application’s screens is to build a foundation for the next phase of the project. If you’re an entrepreneur and are outsourcing the bulk of the project’s work, then you would show these sketches to the design and development team in order to get a price estimate.
Action item: Sketch out all screens of your app.

Step 4: Identify The Work To Be Outsourced

What skills do you bring to the table? Are you a designer whose brain objects to Objective C? A developer who couldn’t design their way out of a paper bag? Or simply an individual with an idea they’d like to bring to market?
When you create an iPhone application, you’re starting a small business. It is difficult for one person to play the role of researcher, project manager, accountant, information architect, designer, developer, marketer and advertiser. Can you do it all? Of course you can, but you would be wasting a lot of time, energy and sanity in the process. Based on the following list of required skills, define the areas where you would be comfortable taking the lead and where you would need to hire help:

• Design,
• Programming,
• Promotion and marketing.

In most cases, the least expensive way to produce your application would be by hiring freelance contractors. While your costs would be lower, your role as project manager would become more prominent. You would spend more time managing the moving parts of the project. Also, when working with freelancers, remember to have them sign a non-disclosure agreement or at least an employment contract, with details on the scope of their work, your expectations and payment terms.
Another option is to hire an agency or development firm to handle a large chunk of the production. In this scenario, the agency would be charged with managing the project, and your role as client would be to review and approve its work. Working with an agency is a good option if you have a larger budget and less time to dedicate to the production process.
Action item: Identify your role and the roles of those you hire.

Step 5: Hiring Your Team

In step 4, you defined which roles need to be outsourced in order to produce the app. Now it’s time to learn exactly what each of those roles will do and where to find people for your team.

Design

If you are a designer, download my “iPhone App Template,” a big collection of iPhone UI elements. These Photoshop files will save you a lot of time getting started on the design. To learn more about mobile design in general, these websites provide a lot of great resources:

• Marc Edwards’ articles
• Ken Yarmosh’s blog
• Luke Wroblewski’s blog
• DesignBoost (disclaimer: this is my mobile design training website)
• UI Stencils

If you’re not a designer, then you should know that design breaks down into three roles: information architecture, interaction design and visual design. Finding one person with all of these skills is possible, but know that the design process calls for three distinct deliverables. If you’ve got your sketches, then you have everything you need for a designer to get started.

• Information architecture
  In case you’re familiar with the Web design process, “information architecture” as it relates to mobile is very similar. If you’re not familiar with the term, it simply means “organizing the content in your app.”
• Interaction design
  Have you ever used an app that you didn’t need any instruction to operate? One in which the flow was so intuitive that you barely noticed the interface? It wasn’t by accident. This is the job of the interaction designer, someone who sorts out how the user will move from screen to screen to accomplish their task. Be sure to hire a designer who has skill in this area.
• Visual design
  Visual design is the final step in the design process. It is the “skin” that overlays the controls for the app. The visual design can be as simple or as complex as you want; the key is to focus on the usability and primary task of the app.

Try to find a designer who has experience designing for mobile devices. They will have some good feedback and suggestions to improve your sketches. A few places to look for designers:

• Dribbble
• crowdSPRING
• Elance

When posting your job offer, be very specific about your requirements, and be ready to review a lot of portfolios.

Development

If you are an Objective C or Cocoa developer, then crack open Xcode and get started! Join a few forums if you haven’t already:

• Developer Forums, Apple
• iPhoneSDK, Google Group
• StackOverflow

If you are not a developer, then get your developer on board as you’re lining up the designer. Speaking with a developer sooner than later will help you scope a project that is technically feasible and within your budget.
Finding a developer
Using the sketches you’ve drawn up, compose a specification document that describes in writing what your app does and for whom. This document, along with your sketches, is what you will share with the developer to get a time and cost estimate.
Having a document like this also ensures that you will be able to hire a developer who has the skills necessary to produce the app. If you provide specifications for a game app to a developer who doesn’t have game development expertise, they will be able to quickly tell that the project isn’t a good fit.
Here are a few places to look for developers:

• oDesk
• They Make Apps
• Elance
• Any of the forums listed above for designers

Submitting your app to the App Store
Your developer can also help you submit your application to the App Store. Clearly communicate the launch date of your app to the developer. Nothing is more detrimental to an app’s success than an unexpected or poorly planned launch. To learn more, read Apple’s “App Store Review Guidelines.” Also, you might want to check Average App Store Review Times and unpublished rules and clarifications from Apple’s App Review team that can cause your iPhone app to be rejected.

Marketing and Promotion

If a tree falls in the forest and nobody is around to hear it, does it make a sound? Apps can sit in the store unnoticed very easily. Don’t let this happen to you. Be ready with a plan to market your app. In fact, be ready with many plans to market your app. Be ready to experiment because some ideas will work, and others won’t.
Strategies for marketing and promotion:

• Incorporate social media.
  Think about how your app could incorporate social media, and build that functionality into it. At a minimum, set up fan pages for your app on Facebook and Twitter, and use them as platforms to communicate with users and get feedback. The developers of Angry Birds and Instagram do a good job of engaging users on Facebook.
• Pre-launch promotion
  Start building buzz about your app before it launches. Email journalists and bloggers who write about things related to your app. The more relevant your app is to their niche, the better your chances of getting written about. Some outlets to consider:
  • TUAW (The Unofficial Apple Weblog)
  • Macworld
  • AppCraver
  • TouchArcade
• Plan for multiple releases.
  Don’t pack your first release with every feature you want to offer. Create a dream list, and design the app so that it can accommodate all of these features in the future. Then periodically release new versions of the app to boost sales.
• Other sources of app marketing ideas:
  • “Indie iPhone App Marketing,” Chris Hulbert, Splinter Software
  • Mobile Marketer
  • Mobile Marketing Watch
  • “App Store Marketing,” LinkedIn group

Action item: Find freelance or agency contractors to fill the roles for design, development and marketing.

Conclusion

Transforming something as intangible as an idea into a tangible, playable, enjoyable app is an exciting venture. The most important takeaway for anyone looking to create their first iPhone app is to focus on hiring the right team to help bring your idea to fruition and to help maintain the app over time.
If you are an app developer with advice to share with first-time creators, please share in the comments below. Good luck and have fun!

http://mobile.smashingmagazine.com/2009/08/11/how-to-create-your-first-iphone-application/