A rambling talk about how the same things that comprise of effective design are misused to create effective phishing pages. Additionally the browser UI and security controls focus on things that most people completely ignore. The idea of the presentation was to plant a seed of an idea that designers might be able to shape and take the lead in designing secure solutions meant for ordinary non-technical users if they start thinking about security as part of their deliverable. This can even be done by ensuring that security team and designers collaborate on more projects together. The presentation makes a lot more sense with the accompanying video http://hasgeek.tv/metarefresh/2013/497-how-to-tell-if-youre-designing-an-insecure-site

1. HOW TO Tell if your
designing an
insecure website
Akash Mahajan at Meta Refresh 2013

2. Hasgeek Doesn’t
Allow How-tos As Does this
Talks But I Got In !! bother you?
:P
HOW TO Tell if your
designing
an insecure website

3. Joke

4. DISCLAIMER
Insecure
Websites
Design and
UI/UX
This is not a how to, this is
more like a series of thoughts

5. Effective
Design, UI
or UX
Talking About Effective Design

6. Can we say effective
design is
Something that compels
a user to do what the
designer wanted?

7. Gmail ; A Great Example of Effective Design

8. Close Look at our example
Phishing Attack or Effective Design

9. Even closer look at our example
1. Favicon FTW
2. Bookmark link

10. Phishing with a ph!

11. Salient features of effective design
Assumptions – maybe based on
data like heat maps etc.
Call to action – green button = go
Visual cues and
logos to inspire
trust

12. Salient features of phishing
Most people don’t
Notice what is in the
address bar
People love to fill login
forms

13. Address bar/URL can look like
scheme://[login[:password]@]
(host_name|host_address)[:po
rt][/hierarchical/path/to/re
source[?search_string][#frag
ment_id]]
From Browser Security Handbook http://code.google.com/p/browsersec/wiki/Part1

14. Design Thinking?

15. Maybe Don’t Think == Impulsive
im·pul·sive /imˈp lsiv/
ə
Adjective
Acting or done without forethought:
"young impulsive teenagers shoppers".

16. phish·ing
made up word
is the act of attempting to acquire
information such as usernames,
passwords, and credit card details by
masquerading as a trustworthy entity
in an electronic communication.

17. Effective Design/UI/UX is about generating
TRUST

18. People trust big shiny locks

19. Best piece of advice from a
show about aliens

20. Two examples where this trust
collides with effective design and
makes the UI/UX bad for the user
1. Password Reset/Change feature
2. An SSL enabled website

21. How password reset should work
akashmahajan@gmail.com
Enter email to reset password
YourSuperSecretPassword

22. What went down behind the scenes
• Code loaded in the browser sent that email to
server.

23. What went down behind the scenes
• Server did bunch of things like check if email
was in database, generated password etc.

24. The difficult part & UI nightmare
How does the server know
that it is you who filled the
email and you are the owner
of this email address?

25. So how is it supposed to work?
• Using out of band communication.
• Code loaded in the browser sent that email to
server.

26. And…..?
• Web server will email you a unique link.
Hoping that the email address is in your hands
• You click on the link and go back to the server.
• Server confirms the link is proper it allows you
to reset the password

27. Just FYI, that the email
address you sent to the
server and the password
you got back were in
CLEARTEXT

28. People/stuff between you & the
server
• Wireless Network
• Helpful IT admin monitoring for “bad traffic”
• ISP gateway with helpful IT admin
“monitoring”
• Country level gateway with helpful govt. IT
admin “monitoring” – Think Tunisia, Egypt, Iran
• Helpful Server admin “monitoring”
• And who knows what else is out there.

29. Just to recap!
• Effective Design/UI/UX inspires trust.
• People trust based on strong visual cues
• These cues can be faked.
• So ideally trust no one
• If we use common sense approach to
generating a new password we will need
to trust multiple intermediaries.

30. So how do we create secure websites?
Finally a problem worthy of philosoraptor

32. HTTP + SSL/TLS = HTTPS

33. SSL/TLS
Encrypted Communication – Nobody
can see your message hence can’t
change it
Secure Identification of a Network –
Are you talking to the right server?

34. http://www.trailofbits.com/resources/creating_a_rogue_ca_cert_slides.pdf

35. Bad Things can Happen
Comodo an affiliate of a root CA was hacked.
DigiNotar another affiliate was hacked.
Hundreds of certificates for google, yahoo,
mozilla, MS windows update were released.

36. Rougue SSL Certificate

39. Secure By Design
Will cover this
next year!

40. I don’t have any answers for
you
• I am not a designer. I understand security in
systems.
• I understand that people want to use systems
to do things, not get stopped due to security
or insecurity.
• The idea was to get your attention and see if
these problems can be solved using design.

41. @makash
Akash Mahajan
That Web Application Security Guy