diff --git a/client/src/App.tsx b/client/src/App.tsx
new file mode 100644
index 0000000..958a48d
--- /dev/null
+++ b/client/src/App.tsx
@@ -0,0 +1,46 @@
+
+import React, { useState } from 'react';
+
+import './App.css';
+
+
+const Cluster = () => {
+  return (
+    <div className='Cluster'>cluster</div>
+  );
+};
+
+type Identity = {
+  lastName: string,
+  middleName: string,
+  firstName: string,
+  descriptors: number[],
+  id: number
+  displayName: string,
+};
+
+const Identities = () => {
+  const [identities, setIdentities] = useState<Identity[]>([]);
+
+  const identitiesJSX = identities.map(identity => (
+    <img alt={identity.id.toString()} src={`/faces/{identity.id}/{identity.id}.png`}/>
+  ))
+  return (
+    <div className='Identities'>
+      { identitiesJSX }
+    </div>
+  );
+};
+
+const App = () => {
+  return (
+    <div className="App">
+      <div className="Worksheet">
+        <Cluster/>
+        <Identities/>
+      </div>
+    </div>
+  );
+}
+
+export default App;