But will be OK if only replaced with the Main.storyboard that big nerd provided.
Can anyone tell me why?
following is my Main.storyboard code:
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="11762" systemVersion="15G1217" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" colorMatched="YES" initialViewController="4lN-OE-eCx">
<dependencies>
<deployment identifier="iOS"/>
<plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="11757"/>
<capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
</dependencies>
<scenes>
<!--Photorama-->
<scene sceneID="tne-QT-ifu">
<objects>
<viewController id="BYZ-38-t0r" customClass="PhotosViewController" customModule="Photorama" customModuleProvider="target" sceneMemberID="viewController">
<layoutGuides>
<viewControllerLayoutGuide type="top" id="y3c-jy-aDJ"/>
<viewControllerLayoutGuide type="bottom" id="wfy-db-euE"/>
</layoutGuides>
<view key="view" contentMode="scaleToFill" id="8bC-Xf-vdC">
<rect key="frame" x="0.0" y="0.0" width="375" height="667"/>
<autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
<subviews>
<collectionView clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="scaleToFill" dataMode="prototypes" translatesAutoresizingMaskIntoConstraints="NO" id="ebP-XI-Cib">
<color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<collectionViewFlowLayout key="collectionViewLayout" minimumLineSpacing="2" minimumInteritemSpacing="2" id="jtj-rG-pPT">
<size key="itemSize" width="90" height="90"/>
<size key="headerReferenceSize" width="0.0" height="0.0"/>
<size key="footerReferenceSize" width="0.0" height="0.0"/>
<inset key="sectionInset" minX="2" minY="2" maxX="2" maxY="2"/>
</collectionViewFlowLayout>
<cells>
<collectionViewCell opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="center" reuseIdentifier="PhotoCollectionViewCell" id="c4q-34-Klb" customClass="PhotoCollectionViewCell" customModule="Photorama" customModuleProvider="target">
<rect key="frame" x="2" y="2" width="90" height="90"/>
<autoresizingMask key="autoresizingMask" flexibleMaxX="YES" flexibleMaxY="YES"/>
<view key="contentView" opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="center">
<rect key="frame" x="0.0" y="0.0" width="90" height="90"/>
<autoresizingMask key="autoresizingMask"/>
<subviews>
<imageView userInteractionEnabled="NO" contentMode="scaleAspectFill" horizontalHuggingPriority="251" verticalHuggingPriority="251" translatesAutoresizingMaskIntoConstraints="NO" id="T1g-si-TO6">
</imageView>
<activityIndicatorView hidden="YES" opaque="NO" contentMode="scaleToFill" horizontalHuggingPriority="750" verticalHuggingPriority="750" hidesWhenStopped="YES" style="white" translatesAutoresizingMaskIntoConstraints="NO" id="wdG-RC-okQ">
</activityIndicatorView>
</subviews>
</view>
<color key="backgroundColor" red="0.0" green="0.0" blue="0.0" alpha="1" colorSpace="calibratedRGB"/>
<constraints>
<constraint firstItem="wdG-RC-okQ" firstAttribute="centerX" secondItem="c4q-34-Klb" secondAttribute="centerX" id="9St-03-wtW"/>
<constraint firstItem="wdG-RC-okQ" firstAttribute="centerY" secondItem="c4q-34-Klb" secondAttribute="centerY" id="Sie-US-Tty"/>
<constraint firstItem="T1g-si-TO6" firstAttribute="top" secondItem="c4q-34-Klb" secondAttribute="top" id="VYB-Xa-6FS"/>
<constraint firstItem="T1g-si-TO6" firstAttribute="leading" secondItem="c4q-34-Klb" secondAttribute="leading" id="hNG-Pg-2Pl"/>
<constraint firstAttribute="trailing" secondItem="T1g-si-TO6" secondAttribute="trailing" id="ocg-BA-2eZ"/>
<constraint firstAttribute="bottom" secondItem="T1g-si-TO6" secondAttribute="bottom" id="rSl-ko-J5r"/>
</constraints>
<connections>
<outlet property="imageView" destination="T1g-si-TO6" id="IHE-hA-6Jg"/>
<outlet property="spinner" destination="wdG-RC-okQ" id="HKX-H2-dhs"/>
<segue destination="Uih-vp-Gzj" kind="show" identifier="showPhoto" id="nIl-En-YOr"/>
</connections>
</collectionViewCell>
</cells>
</collectionView>
</subviews>
<color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<constraints>
<constraint firstAttribute="bottom" secondItem="ebP-XI-Cib" secondAttribute="bottom" id="Bab-Ja-UZC"/>
<constraint firstItem="ebP-XI-Cib" firstAttribute="leading" secondItem="8bC-Xf-vdC" secondAttribute="leading" id="O78-W3-pMK"/>
<constraint firstItem="ebP-XI-Cib" firstAttribute="top" secondItem="8bC-Xf-vdC" secondAttribute="top" id="eNg-n4-pvl"/>
<constraint firstAttribute="trailing" secondItem="ebP-XI-Cib" secondAttribute="trailing" id="eSz-uV-6Bb"/>
</constraints>
</view>
<navigationItem key="navigationItem" title="Photorama" id="hUy-tm-7ql"/>
<connections>
<outlet property="collectionView" destination="ebP-XI-Cib" id="Lda-KI-r5S"/>
</connections>
</viewController>
<placeholder placeholderIdentifier="IBFirstResponder" id="dkx-z0-nzr" sceneMemberID="firstResponder"/>
</objects>
<point key="canvasLocation" x="1012" y="778"/>
</scene>
<!--Photo Info View Controller-->
<scene sceneID="8K5-3d-26e">
<objects>
<viewController id="Uih-vp-Gzj" customClass="PhotoInfoViewController" customModule="Photorama" customModuleProvider="target" sceneMemberID="viewController">
<layoutGuides>
<viewControllerLayoutGuide type="top" id="OzJ-On-ALI"/>
<viewControllerLayoutGuide type="bottom" id="No1-Fb-oDi"/>
</layoutGuides>
<view key="view" contentMode="scaleToFill" id="gPI-HM-7KE">
<rect key="frame" x="0.0" y="0.0" width="375" height="667"/>
<autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
<subviews>
<imageView userInteractionEnabled="NO" contentMode="scaleAspectFill" horizontalHuggingPriority="251" verticalHuggingPriority="251" translatesAutoresizingMaskIntoConstraints="NO" id="TPf-Q6-LD0">
</imageView>
</subviews>
<color key="backgroundColor" white="1" alpha="1" colorSpace="calibratedWhite"/>
<constraints>
<constraint firstItem="TPf-Q6-LD0" firstAttribute="top" secondItem="OzJ-On-ALI" secondAttribute="bottom" id="8Yg-4m-c2l"/>
<constraint firstAttribute="trailingMargin" secondItem="TPf-Q6-LD0" secondAttribute="trailing" id="Mle-nc-H8O"/>
<constraint firstItem="TPf-Q6-LD0" firstAttribute="leading" secondItem="gPI-HM-7KE" secondAttribute="leadingMargin" id="Ygb-FS-Vtp"/>
<constraint firstItem="No1-Fb-oDi" firstAttribute="top" secondItem="TPf-Q6-LD0" secondAttribute="bottom" id="zNM-HU-TDt"/>
</constraints>
</view>
<connections>
<outlet property="imageView" destination="TPf-Q6-LD0" id="SyC-Wt-Auu"/>
</connections>
</viewController>
<placeholder placeholderIdentifier="IBFirstResponder" id="fQV-Fe-JeW" userLabel="First Responder" sceneMemberID="firstResponder"/>
</objects>
<point key="canvasLocation" x="1791" y="788"/>
</scene>
<!--Navigation Controller-->
<scene sceneID="5WI-Ur-HbX">
<objects>
<navigationController automaticallyAdjustsScrollViewInsets="NO" id="4lN-OE-eCx" sceneMemberID="viewController">
<toolbarItems/>
<navigationBar key="navigationBar" contentMode="scaleToFill" id="Zif-c1-0Vj">
<rect key="frame" x="0.0" y="0.0" width="375" height="44"/>
<autoresizingMask key="autoresizingMask"/>
</navigationBar>
<nil name="viewControllers"/>
<connections>
<segue destination="BYZ-38-t0r" kind="relationship" relationship="rootViewController" id="8kg-P8-KH3"/>
</connections>
</navigationController>
<placeholder placeholderIdentifier="IBFirstResponder" id="BRA-Un-3Rw" userLabel="First Responder" sceneMemberID="firstResponder"/>
</objects>
<point key="canvasLocation" x="383" y="387"/>
</scene>
</scenes>
</document>