SlideShare a Scribd company logo
1 of 105
UX-UI
Building a desirable cloud
       application




 April ’12 - A presentation at Microsoft Greece
who is talking
Panos Kontopoulos
GM & Partner at WEDIA
www.mentalblock.gr
www.wedia.gr
@pkontopoulos
Software Engineering lover
Business and Marketing

Singular - ERP Architect
Intarget - Internet 1.0 agency
Microsoft - Services and Web
Strategy
Wedia - Complex, Popular, Hand
Crafted web sites
unique users per
 2.400.000   month


50.000.000   pageviews per month



     6.500   hits/sec



  220.000    articles in 3 years



 1.350.000   comments
share some thoughts

a new generation of
applications
on the cloud
web based
device agnostic
share some thoughts

why there’s more than
features
why design matters
why user experience
matters
share some thoughts

about your competition
unless everybody in the
room

is building a Greek
Accounting software
application
(limited to Greek Tax
System)
your competition

is world wide
wait, there is ROI
but first things, first
have you realized ?
all you have is your web site

      a landing page
ooops, I just forgot

you have also a coming soon
            page
so let’s get back to your

     landing page
don’t forget the features page
and the pricing page
don’t forget the reminders
and your customer feedback
getting inside your application
mega
menu
s
faceted
navigati
     on
blank
 slate
the queen of all, the web form
speaking of tools and processes
meet the personas
travel through user journeys
Goal: To buy the items in my basket!
              Basket!               New or existing!   Delivery details!                                    Payment!             Confirmation!
                                                           New customer!


                 List of selected           Select

Add product                                                    Enter name and                                    Enter credit
                    items and              checkout
                                  Enter address
                                                                                                  !                                     Confirm!
 to basket
         !                                                      email address
                                                                            !                                    card details!
                     quantities
                              !             option!




                                                           Existing customer!

                    Edit basket
                              !

                                                                            Select save
                                             Login!                          name and
                                                                              address!




                                                                           Add new name
                                                                            and address
                                                                                      !




                                                           Notes!
                                                           Several existing customers find it easier to
                                                           checkout as a new customer as they don’t
                                                           remember their username and password and
                                                           find managing address fiddly. We should aim to
                                                           make this much simply with the next release
                                                           and enhance the process for repeat customers.!
and of course wireframe

  until you agree on
 what will be designed
speaking of mobile devices
say hello to responsive design
food for thought
THANK YOU!
 panos@wedia.gr
 @pkontopoulos

More Related Content

More from Panos Kontopoulos

Wedia Social Media presentation at DigitalDays
Wedia Social Media presentation at DigitalDaysWedia Social Media presentation at DigitalDays
Wedia Social Media presentation at DigitalDaysPanos Kontopoulos
 
Wedia at AllThingsFacebook 2012
Wedia at AllThingsFacebook 2012Wedia at AllThingsFacebook 2012
Wedia at AllThingsFacebook 2012Panos Kontopoulos
 
Financial Services Web Strategies
Financial Services Web StrategiesFinancial Services Web Strategies
Financial Services Web StrategiesPanos Kontopoulos
 
Blogging @Microsoft in Greek for Greek Bloggers Camp '07
Blogging @Microsoft in Greek for Greek Bloggers Camp '07Blogging @Microsoft in Greek for Greek Bloggers Camp '07
Blogging @Microsoft in Greek for Greek Bloggers Camp '07Panos Kontopoulos
 

More from Panos Kontopoulos (6)

Wedia Social Media presentation at DigitalDays
Wedia Social Media presentation at DigitalDaysWedia Social Media presentation at DigitalDays
Wedia Social Media presentation at DigitalDays
 
Wedia at AllThingsFacebook 2012
Wedia at AllThingsFacebook 2012Wedia at AllThingsFacebook 2012
Wedia at AllThingsFacebook 2012
 
Social Media Snack 092008
Social Media Snack 092008Social Media Snack 092008
Social Media Snack 092008
 
MSLaunch08-iteam profile
MSLaunch08-iteam profileMSLaunch08-iteam profile
MSLaunch08-iteam profile
 
Financial Services Web Strategies
Financial Services Web StrategiesFinancial Services Web Strategies
Financial Services Web Strategies
 
Blogging @Microsoft in Greek for Greek Bloggers Camp '07
Blogging @Microsoft in Greek for Greek Bloggers Camp '07Blogging @Microsoft in Greek for Greek Bloggers Camp '07
Blogging @Microsoft in Greek for Greek Bloggers Camp '07
 

Recently uploaded

Vertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering TipsVertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering TipsMiki Katsuragi
 
Connect Wave/ connectwave Pitch Deck Presentation
Connect Wave/ connectwave Pitch Deck PresentationConnect Wave/ connectwave Pitch Deck Presentation
Connect Wave/ connectwave Pitch Deck PresentationSlibray Presentation
 
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostLeverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostZilliz
 
Training state-of-the-art general text embedding
Training state-of-the-art general text embeddingTraining state-of-the-art general text embedding
Training state-of-the-art general text embeddingZilliz
 
SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024Lorenzo Miniero
 
DevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache MavenDevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache MavenHervé Boutemy
 
Human Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR SystemsHuman Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR SystemsMark Billinghurst
 
Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Commit University
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada
 
My Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationMy Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationRidwan Fadjar
 
WordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your BrandWordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your Brandgvaughan
 
Scanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsScanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsRizwan Syed
 
"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii SoldatenkoFwdays
 
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Mark Simos
 
Bun (KitWorks Team Study 노별마루 발표 2024.4.22)
Bun (KitWorks Team Study 노별마루 발표 2024.4.22)Bun (KitWorks Team Study 노별마루 발표 2024.4.22)
Bun (KitWorks Team Study 노별마루 발표 2024.4.22)Wonjun Hwang
 
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada
 
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek SchlawackFwdays
 
AI as an Interface for Commercial Buildings
AI as an Interface for Commercial BuildingsAI as an Interface for Commercial Buildings
AI as an Interface for Commercial BuildingsMemoori
 
Commit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyCommit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyAlfredo García Lavilla
 

Recently uploaded (20)

E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptxE-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
 
Vertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering TipsVertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering Tips
 
Connect Wave/ connectwave Pitch Deck Presentation
Connect Wave/ connectwave Pitch Deck PresentationConnect Wave/ connectwave Pitch Deck Presentation
Connect Wave/ connectwave Pitch Deck Presentation
 
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostLeverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
 
Training state-of-the-art general text embedding
Training state-of-the-art general text embeddingTraining state-of-the-art general text embedding
Training state-of-the-art general text embedding
 
SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024
 
DevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache MavenDevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache Maven
 
Human Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR SystemsHuman Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR Systems
 
Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
 
My Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationMy Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 Presentation
 
WordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your BrandWordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your Brand
 
Scanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsScanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL Certs
 
"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko
 
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
 
Bun (KitWorks Team Study 노별마루 발표 2024.4.22)
Bun (KitWorks Team Study 노별마루 발표 2024.4.22)Bun (KitWorks Team Study 노별마루 발표 2024.4.22)
Bun (KitWorks Team Study 노별마루 발표 2024.4.22)
 
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
 
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack
 
AI as an Interface for Commercial Buildings
AI as an Interface for Commercial BuildingsAI as an Interface for Commercial Buildings
AI as an Interface for Commercial Buildings
 
Commit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyCommit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easy
 

UX-UI. Building a desirable cloud application

Editor's Notes

  1. \n
  2. \n
  3. Introductions\n
  4. my delicious tag cloud \n
  5. \n
  6. my work\n
  7. part of our portfolio \n
  8. some impressive numbers for gazzetta.gr\n
  9. \n
  10. mobile apps \n
  11. viral web videos\n
  12. \n
  13. facebook social games \n
  14. \n
  15. \n
  16. \n
  17. \n
  18. \n
  19. sometime ago I was looking for an agile supporting service to host our projects \n
  20. several options are available\n
  21. you can tell in the very first seconds some things about them \n
  22. definitely design counts \n
  23. \n
  24. number of search results for ux \n
  25. a first definition\n
  26. \n
  27. \n
  28. \n
  29. \n
  30. there is scientific background\n
  31. \n
  32. so user experience is about how someone looks at your company, brand, service, products in total \ntake le web for example, it’s more than a conference, it’s an experience \n
  33. \n
  34. there is no software in cloud applications\n
  35. there are no salesmen \n
  36. no boxes and cds\n
  37. \n
  38. \n
  39. \n
  40. \n
  41. \n
  42. \n
  43. added virality\n
  44. \n
  45. \n
  46. excellent examples \n
  47. \n
  48. \n
  49. \n
  50. \n
  51. \n
  52. colors are important \n
  53. \n
  54. \n
  55. \n
  56. \n
  57. \n
  58. \n
  59. \n
  60. \n
  61. \n
  62. \n
  63. \n
  64. \n
  65. \n
  66. looking for a crm? \n
  67. not exactly what I had in mind :-( \n
  68. I would prefer something closer to what I use everyday\n
  69. tags and beautiful buttons on the sidebar \n
  70. hot links, color usage and space, less is more \n
  71. look what we have done in Wedia \n
  72. look what we have done in Wedia \n
  73. some UI patterns, new kind of menus \n
  74. \n
  75. \n
  76. \n
  77. \n
  78. \n
  79. \n
  80. \n
  81. \n
  82. you can find inspiration\n
  83. you can find inspiration\n
  84. \n
  85. \n
  86. \n
  87. \n
  88. software platforms already incorporate them \n
  89. \n
  90. \n
  91. \n
  92. examples from our projects \n
  93. \n
  94. information architecture and let the designer free\n
  95. \n
  96. \n
  97. \n
  98. \n
  99. \n
  100. \n
  101. \n
  102. everybody says so\n
  103. \n
  104. \n
  105. \n