SlideShare a Scribd company logo
1 of 22
Download to read offline
Creating a Facebook Clone - Part I
Deconstruction
✦Deep vs. Flat
✦Forms With no functionality
✦Plain Text Password
✦Delayed Verification
✦Device Orientation Behavior
✦Phone vs. Tablet UI
✦Adherence to platform conventions
© Codename One 2017 all rights reserved
© Codename One 2017 all rights reserved
Sign In UI
© Codename One 2017 all rights reserved
Sign In UI - My Version
Deep vs. Flat
✦Deep
✦Flat
✦Facebook chose both
✦Intuitive
✦Portable
✦Process
© Codename One 2017 all rights reserved
Deep vs. Flat
© Codename One 2017 all rights reserved
© Codename One 2017 all rights reserved
Sign In UI
© Codename One 2017 all rights reserved
Sign In UI
© Codename One 2017 all rights reserved
Sign In UI
© Codename One 2017 all rights reserved
Forms With no Functionality
© Codename One 2017 all rights reserved
Sign In UI
© Codename One 2017 all rights reserved
Sign In UI
© Codename One 2017 all rights reserved
Sign In UI
© Codename One 2017 all rights reserved
Plain Text Password/Delayed Verification
Device Orientation Behavior
© Codename One 2017 all rights reserved
Phone vs. Tablet UI
© Codename One 2017 all rights reserved
Adherence to platform conventions
© Codename One 2017 all rights reserved
Adherence to platform conventions
© Codename One 2017 all rights reserved
Adherence to platform conventions
© Codename One 2017 all rights reserved
© Codename One 2017 all rights reserved
iPad
© Codename One 2017 all rights reserved
The Main UI
© Codename One 2017 all rights reserved
No Hamburger

More Related Content

Similar to Creating a Facebook Clone - Part I.pdf

Porting iPhone Apps to Windows Phone 7
Porting iPhone Apps to Windows Phone 7Porting iPhone Apps to Windows Phone 7
Porting iPhone Apps to Windows Phone 7
Wes Yanaga
 
BP3: Mobile for BPM, BPM for Mobile Rev 1
BP3: Mobile for BPM, BPM for Mobile Rev 1BP3: Mobile for BPM, BPM for Mobile Rev 1
BP3: Mobile for BPM, BPM for Mobile Rev 1
BP3 Global, Inc.
 

Similar to Creating a Facebook Clone - Part I.pdf (20)

Effective Smartphone UX at GREE
Effective Smartphone UX at GREEEffective Smartphone UX at GREE
Effective Smartphone UX at GREE
 
Speech Recognition as a User Interface
Speech Recognition as a User InterfaceSpeech Recognition as a User Interface
Speech Recognition as a User Interface
 
dotFes KYOTO - スマホ開発にAIR & PhoneGapを勧める5つの理由
dotFes KYOTO - スマホ開発にAIR & PhoneGapを勧める5つの理由dotFes KYOTO - スマホ開発にAIR & PhoneGapを勧める5つの理由
dotFes KYOTO - スマホ開発にAIR & PhoneGapを勧める5つの理由
 
The App Maker - Part 2 - Transcript.pdf
The App Maker - Part 2 - Transcript.pdfThe App Maker - Part 2 - Transcript.pdf
The App Maker - Part 2 - Transcript.pdf
 
Devoxx 2010: Develop mobile applications with Flex
Devoxx 2010: Develop mobile applications with FlexDevoxx 2010: Develop mobile applications with Flex
Devoxx 2010: Develop mobile applications with Flex
 
PhoneGap Enterprise Viewer - ConnectCon 2015
PhoneGap Enterprise Viewer - ConnectCon 2015PhoneGap Enterprise Viewer - ConnectCon 2015
PhoneGap Enterprise Viewer - ConnectCon 2015
 
Creating a Facebook Clone - Part II - Transcript.pdf
Creating a Facebook Clone - Part II - Transcript.pdfCreating a Facebook Clone - Part II - Transcript.pdf
Creating a Facebook Clone - Part II - Transcript.pdf
 
Porting iPhone Apps to Windows Phone 7
Porting iPhone Apps to Windows Phone 7Porting iPhone Apps to Windows Phone 7
Porting iPhone Apps to Windows Phone 7
 
BethClip Pitch Deck 2017 for İnvestors
BethClip Pitch Deck 2017 for İnvestorsBethClip Pitch Deck 2017 for İnvestors
BethClip Pitch Deck 2017 for İnvestors
 
JUMP13 Whitepapers Live: Mobile Innovation
JUMP13 Whitepapers Live: Mobile InnovationJUMP13 Whitepapers Live: Mobile Innovation
JUMP13 Whitepapers Live: Mobile Innovation
 
Open Development - an Engineering Manager's Perspective
Open Development - an Engineering Manager's PerspectiveOpen Development - an Engineering Manager's Perspective
Open Development - an Engineering Manager's Perspective
 
BethClip Investors Pitch Deck (widescreen)
BethClip Investors Pitch Deck (widescreen)BethClip Investors Pitch Deck (widescreen)
BethClip Investors Pitch Deck (widescreen)
 
BP3: Mobile for BPM, BPM for Mobile Rev 1
BP3: Mobile for BPM, BPM for Mobile Rev 1BP3: Mobile for BPM, BPM for Mobile Rev 1
BP3: Mobile for BPM, BPM for Mobile Rev 1
 
Multi platform development
Multi platform developmentMulti platform development
Multi platform development
 
How do I - Localization and Internationalization (l10n, i18n).pdf
How do I - Localization and Internationalization (l10n, i18n).pdfHow do I - Localization and Internationalization (l10n, i18n).pdf
How do I - Localization and Internationalization (l10n, i18n).pdf
 
How do i - localization and internationalization (l10n, i18n)
How do i - localization and internationalization (l10n, i18n)How do i - localization and internationalization (l10n, i18n)
How do i - localization and internationalization (l10n, i18n)
 
Android Development: Approach for Agile Teams
Android Development: Approach for Agile TeamsAndroid Development: Approach for Agile Teams
Android Development: Approach for Agile Teams
 
Hybrid Mobile App Development Frameworks 2016
Hybrid Mobile App Development Frameworks 2016Hybrid Mobile App Development Frameworks 2016
Hybrid Mobile App Development Frameworks 2016
 
How do I - Working With Images.pdf
How do I - Working With Images.pdfHow do I - Working With Images.pdf
How do I - Working With Images.pdf
 
Top 4 Cross Platform App Development.pptx
Top 4 Cross Platform App Development.pptxTop 4 Cross Platform App Development.pptx
Top 4 Cross Platform App Development.pptx
 

More from ShaiAlmog1

More from ShaiAlmog1 (20)

The Duck Teaches Learn to debug from the masters. Local to production- kill ...
The Duck Teaches  Learn to debug from the masters. Local to production- kill ...The Duck Teaches  Learn to debug from the masters. Local to production- kill ...
The Duck Teaches Learn to debug from the masters. Local to production- kill ...
 
create-netflix-clone-06-client-ui.pdf
create-netflix-clone-06-client-ui.pdfcreate-netflix-clone-06-client-ui.pdf
create-netflix-clone-06-client-ui.pdf
 
create-netflix-clone-01-introduction_transcript.pdf
create-netflix-clone-01-introduction_transcript.pdfcreate-netflix-clone-01-introduction_transcript.pdf
create-netflix-clone-01-introduction_transcript.pdf
 
create-netflix-clone-02-server_transcript.pdf
create-netflix-clone-02-server_transcript.pdfcreate-netflix-clone-02-server_transcript.pdf
create-netflix-clone-02-server_transcript.pdf
 
create-netflix-clone-04-server-continued_transcript.pdf
create-netflix-clone-04-server-continued_transcript.pdfcreate-netflix-clone-04-server-continued_transcript.pdf
create-netflix-clone-04-server-continued_transcript.pdf
 
create-netflix-clone-01-introduction.pdf
create-netflix-clone-01-introduction.pdfcreate-netflix-clone-01-introduction.pdf
create-netflix-clone-01-introduction.pdf
 
create-netflix-clone-06-client-ui_transcript.pdf
create-netflix-clone-06-client-ui_transcript.pdfcreate-netflix-clone-06-client-ui_transcript.pdf
create-netflix-clone-06-client-ui_transcript.pdf
 
create-netflix-clone-03-server.pdf
create-netflix-clone-03-server.pdfcreate-netflix-clone-03-server.pdf
create-netflix-clone-03-server.pdf
 
create-netflix-clone-04-server-continued.pdf
create-netflix-clone-04-server-continued.pdfcreate-netflix-clone-04-server-continued.pdf
create-netflix-clone-04-server-continued.pdf
 
create-netflix-clone-05-client-model_transcript.pdf
create-netflix-clone-05-client-model_transcript.pdfcreate-netflix-clone-05-client-model_transcript.pdf
create-netflix-clone-05-client-model_transcript.pdf
 
create-netflix-clone-03-server_transcript.pdf
create-netflix-clone-03-server_transcript.pdfcreate-netflix-clone-03-server_transcript.pdf
create-netflix-clone-03-server_transcript.pdf
 
create-netflix-clone-02-server.pdf
create-netflix-clone-02-server.pdfcreate-netflix-clone-02-server.pdf
create-netflix-clone-02-server.pdf
 
create-netflix-clone-05-client-model.pdf
create-netflix-clone-05-client-model.pdfcreate-netflix-clone-05-client-model.pdf
create-netflix-clone-05-client-model.pdf
 
Creating a Whatsapp Clone - Part II.pdf
Creating a Whatsapp Clone - Part II.pdfCreating a Whatsapp Clone - Part II.pdf
Creating a Whatsapp Clone - Part II.pdf
 
Creating a Whatsapp Clone - Part IX - Transcript.pdf
Creating a Whatsapp Clone - Part IX - Transcript.pdfCreating a Whatsapp Clone - Part IX - Transcript.pdf
Creating a Whatsapp Clone - Part IX - Transcript.pdf
 
Creating a Whatsapp Clone - Part II - Transcript.pdf
Creating a Whatsapp Clone - Part II - Transcript.pdfCreating a Whatsapp Clone - Part II - Transcript.pdf
Creating a Whatsapp Clone - Part II - Transcript.pdf
 
Creating a Whatsapp Clone - Part V - Transcript.pdf
Creating a Whatsapp Clone - Part V - Transcript.pdfCreating a Whatsapp Clone - Part V - Transcript.pdf
Creating a Whatsapp Clone - Part V - Transcript.pdf
 
Creating a Whatsapp Clone - Part IV - Transcript.pdf
Creating a Whatsapp Clone - Part IV - Transcript.pdfCreating a Whatsapp Clone - Part IV - Transcript.pdf
Creating a Whatsapp Clone - Part IV - Transcript.pdf
 
Creating a Whatsapp Clone - Part IV.pdf
Creating a Whatsapp Clone - Part IV.pdfCreating a Whatsapp Clone - Part IV.pdf
Creating a Whatsapp Clone - Part IV.pdf
 
Creating a Whatsapp Clone - Part I - Transcript.pdf
Creating a Whatsapp Clone - Part I - Transcript.pdfCreating a Whatsapp Clone - Part I - Transcript.pdf
Creating a Whatsapp Clone - Part I - Transcript.pdf
 

Recently uploaded

TrustArc Webinar - Unified Trust Center for Privacy, Security, Compliance, an...
TrustArc Webinar - Unified Trust Center for Privacy, Security, Compliance, an...TrustArc Webinar - Unified Trust Center for Privacy, Security, Compliance, an...
TrustArc Webinar - Unified Trust Center for Privacy, Security, Compliance, an...
TrustArc
 
Harnessing Passkeys in the Battle Against AI-Powered Cyber Threats.pptx
Harnessing Passkeys in the Battle Against AI-Powered Cyber Threats.pptxHarnessing Passkeys in the Battle Against AI-Powered Cyber Threats.pptx
Harnessing Passkeys in the Battle Against AI-Powered Cyber Threats.pptx
FIDO Alliance
 
CORS (Kitworks Team Study 양다윗 발표자료 240510)
CORS (Kitworks Team Study 양다윗 발표자료 240510)CORS (Kitworks Team Study 양다윗 발표자료 240510)
CORS (Kitworks Team Study 양다윗 발표자료 240510)
Wonjun Hwang
 
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Victor Rentea
 
Tales from a Passkey Provider Progress from Awareness to Implementation.pptx
Tales from a Passkey Provider  Progress from Awareness to Implementation.pptxTales from a Passkey Provider  Progress from Awareness to Implementation.pptx
Tales from a Passkey Provider Progress from Awareness to Implementation.pptx
FIDO Alliance
 
Easier, Faster, and More Powerful – Alles Neu macht der Mai -Wir durchleuchte...
Easier, Faster, and More Powerful – Alles Neu macht der Mai -Wir durchleuchte...Easier, Faster, and More Powerful – Alles Neu macht der Mai -Wir durchleuchte...
Easier, Faster, and More Powerful – Alles Neu macht der Mai -Wir durchleuchte...
panagenda
 

Recently uploaded (20)

TrustArc Webinar - Unified Trust Center for Privacy, Security, Compliance, an...
TrustArc Webinar - Unified Trust Center for Privacy, Security, Compliance, an...TrustArc Webinar - Unified Trust Center for Privacy, Security, Compliance, an...
TrustArc Webinar - Unified Trust Center for Privacy, Security, Compliance, an...
 
ERP Contender Series: Acumatica vs. Sage Intacct
ERP Contender Series: Acumatica vs. Sage IntacctERP Contender Series: Acumatica vs. Sage Intacct
ERP Contender Series: Acumatica vs. Sage Intacct
 
Harnessing Passkeys in the Battle Against AI-Powered Cyber Threats.pptx
Harnessing Passkeys in the Battle Against AI-Powered Cyber Threats.pptxHarnessing Passkeys in the Battle Against AI-Powered Cyber Threats.pptx
Harnessing Passkeys in the Battle Against AI-Powered Cyber Threats.pptx
 
CORS (Kitworks Team Study 양다윗 발표자료 240510)
CORS (Kitworks Team Study 양다윗 발표자료 240510)CORS (Kitworks Team Study 양다윗 발표자료 240510)
CORS (Kitworks Team Study 양다윗 발표자료 240510)
 
Human Expert Website Manual WCAG 2.0 2.1 2.2 Audit - Digital Accessibility Au...
Human Expert Website Manual WCAG 2.0 2.1 2.2 Audit - Digital Accessibility Au...Human Expert Website Manual WCAG 2.0 2.1 2.2 Audit - Digital Accessibility Au...
Human Expert Website Manual WCAG 2.0 2.1 2.2 Audit - Digital Accessibility Au...
 
ADP Passwordless Journey Case Study.pptx
ADP Passwordless Journey Case Study.pptxADP Passwordless Journey Case Study.pptx
ADP Passwordless Journey Case Study.pptx
 
UiPath manufacturing technology benefits and AI overview
UiPath manufacturing technology benefits and AI overviewUiPath manufacturing technology benefits and AI overview
UiPath manufacturing technology benefits and AI overview
 
Design and Development of a Provenance Capture Platform for Data Science
Design and Development of a Provenance Capture Platform for Data ScienceDesign and Development of a Provenance Capture Platform for Data Science
Design and Development of a Provenance Capture Platform for Data Science
 
الأمن السيبراني - ما لا يسع للمستخدم جهله
الأمن السيبراني - ما لا يسع للمستخدم جهلهالأمن السيبراني - ما لا يسع للمستخدم جهله
الأمن السيبراني - ما لا يسع للمستخدم جهله
 
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
 
How to Check CNIC Information Online with Pakdata cf
How to Check CNIC Information Online with Pakdata cfHow to Check CNIC Information Online with Pakdata cf
How to Check CNIC Information Online with Pakdata cf
 
Six Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal OntologySix Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal Ontology
 
Vector Search @ sw2con for slideshare.pptx
Vector Search @ sw2con for slideshare.pptxVector Search @ sw2con for slideshare.pptx
Vector Search @ sw2con for slideshare.pptx
 
Tales from a Passkey Provider Progress from Awareness to Implementation.pptx
Tales from a Passkey Provider  Progress from Awareness to Implementation.pptxTales from a Passkey Provider  Progress from Awareness to Implementation.pptx
Tales from a Passkey Provider Progress from Awareness to Implementation.pptx
 
AI mind or machine power point presentation
AI mind or machine power point presentationAI mind or machine power point presentation
AI mind or machine power point presentation
 
Event-Driven Architecture Masterclass: Engineering a Robust, High-performance...
Event-Driven Architecture Masterclass: Engineering a Robust, High-performance...Event-Driven Architecture Masterclass: Engineering a Robust, High-performance...
Event-Driven Architecture Masterclass: Engineering a Robust, High-performance...
 
Introduction to use of FHIR Documents in ABDM
Introduction to use of FHIR Documents in ABDMIntroduction to use of FHIR Documents in ABDM
Introduction to use of FHIR Documents in ABDM
 
Simplifying Mobile A11y Presentation.pptx
Simplifying Mobile A11y Presentation.pptxSimplifying Mobile A11y Presentation.pptx
Simplifying Mobile A11y Presentation.pptx
 
Easier, Faster, and More Powerful – Alles Neu macht der Mai -Wir durchleuchte...
Easier, Faster, and More Powerful – Alles Neu macht der Mai -Wir durchleuchte...Easier, Faster, and More Powerful – Alles Neu macht der Mai -Wir durchleuchte...
Easier, Faster, and More Powerful – Alles Neu macht der Mai -Wir durchleuchte...
 
Microsoft CSP Briefing Pre-Engagement - Questionnaire
Microsoft CSP Briefing Pre-Engagement - QuestionnaireMicrosoft CSP Briefing Pre-Engagement - Questionnaire
Microsoft CSP Briefing Pre-Engagement - Questionnaire
 

Creating a Facebook Clone - Part I.pdf