Ripple - the location based group chatting app

Slide 1

Slide 1 text

Ripple the location based group chatting app IMAGE FROM MENG TO

Slide 2

Slide 2 text

Problems • People exchanges digital information anywhere, anytime • Contact exchange shouldn’t be compulsory • Current solutions we have are just broken

Slide 3

Slide 3 text

3 Objectives • Super simple chatroom creation process • Easy access and participate in conversations • Quickly create identity and connect with each other

Slide 4

Slide 4 text

Demo

Slide 5

Slide 5 text

Lesson Learnt (The Good) • UICollectionView are very flexible • Assets Catalog to manage images is time saver • Real-time blurring can be fast and efficient • We can leverage AutoLayout in UICollectionView • Parse supports Cloud code and Push notifications

Slide 6

Slide 6 text

Lesson Learnt (The Bad) • UIKit Dynamics can be slow • Assets Catalog can only be used on iOS 7 • Sidebar navigation pattern is still not ofﬁcial • UIImagePickerController is hardly customizable

Slide 7

Slide 7 text

Libraries & Backend GPUImage THSpringyCollectionView DAKeyboardControl SOCKit ! Parse IMAGE FROM WEB

Slide 8

Slide 8 text

UI & Prototype Sketch 2  http://www.bohemiancoding.com/sketch/ ! Flinto  https://www.ﬂinto.com IMAGE FROM MENG TO

Slide 9

Slide 9 text

iOS libraries community • Github  http://github.com • CocoaPods  http://cocoapods.org • CocoaControls  https://www.cocoacontrols.com

Slide 10

Slide 10 text

Other resources • From Design To iOS7 Prototype  https://medium.com/design-ux/bb582274b93f • My ﬁrst hackathon experience  https://medium.com/unforgettable-moments/3db44088db70 • Angelhack  http://angelhack.com/# • Hackathon.io  http://www.hackathon.io/ripple1

Slide 11

Slide 11 text

Team Meng To Jamz Tang Benny Ng Christopher Yeung @mengto @jamztang @hin556 @chrisyeung1121 Special Thanks: Codeaholics, Angelhack, Joyce Kan, Vincent Kwok, Alfred Lau Design iOS iOS Frontend+Backend

Slide 12

Slide 12 text

AutoLayout + UICollectionView ! - (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath { id object = self.messages[indexPath.row]; ! UICollectionViewCell *cell = self.messagePrototypeCell; ! [self configureCell:cell withObject:object]; ! CGFloat height = [cell systemLayoutSizeFittingSize:CGSizeMake(300, CGFLOAT_MAX)].height; return CGSizeMake(300, height); } SECRET SLIDE

Slide 13

Slide 13 text

Assets Catalog and stretchable images SECRET SLIDE