Available in English & German in the AppStore.

Repository: github.com/ImagineSocial

Program and design by Malte Schoppe

70+ views

57 view controllers

35k+ lines of code

90% Storyboard, 10% Programmatic

100% Swift

Firebase as authentication service, cloud storage and NoSQL database

Dark mode

Push notifications

Use of Page-, TabBar-, Table- and CollectionViewController, Search- and NavigationController, REST APIs

= Information

​

= Nerdstuff

Inhaltsverzeichnis

The app's home screen shows all posts shared with the Imagine community in an endless feed. 

If a user is logged in and follows one or more communities, the community posts in the corresponding time period are loaded and added. 

Swiping or tapping the profile picture opens the side menu. Among other things, this shows the current notifications for likes or comments. 

1. Show placeholder 

Cells.

2. Load header.

3. Fetch last 15 posts.

15th post sets date x.

4. Fetch followed 

communities. 

5. Fetch posts of followed

communities till date x.

6. Combine community 

and normal posts 

and present them.

7. Load notifications 

and current user in 

the side menu.

8. When near end: Fetch

next 15 posts and

repeat steps 5 & 6.

The user and the optionally linked community are selectable in each post. 

There is a menu to save, delete or highlight the post.

The posts can be interacted with by using four different reactions. The meaning is explained when the app is first opened.

Next to the number of comments, a small preview is used to show the user if a description has been added to the post. 

Show text only.

Show single

zoomable picture.

Show metadata 

of website incl.

preview.

Show YouTube 

Video. Playable in the feed or in the browser/

app.

Show up to 

three pictures 

in a collectionView

and swipe 

through them.

Show a preview of a song. Animate to web view 

to select the streaming

service of choice.

Show a looped 

and muted 

Video in the feed.

All cells use auto layout and are self sizing through automatic dimensions.

In the third tab you share new posts.

By default, posts are shared with the entire community in the main feed.

If you link a community, the post will also be displayed in the linked community.

If you want to share the post only in one community, you can specify this after the selection.

Posts can be posted anonymously to address difficult topics.

Switch to feed and reload when posted.

Share your music with the Imagine community and discover recommendations from other users. 

​

Open the shared music conveniently in your streaming service of choice.

1. Get the metadata and the relevant link through the Songwhip REST API. 

2. Get the link metadata and preview (for the Android App).

3. Upload the data to the database.

Open up the web view and load the Songwhip site. Animate the transition.

Call parent tableView to update the height of the cell.

Listen for the interaction inside the web view and open the streaming service.

Selecting a post in the feed takes you to the post view.

This is where the following details are shown:

- Images are displayed in full size.

- The "Likes" are displayed if it is your own post.

- The description is displayed.

- Comments are displayed.

- Comments can be made. 

Add answerView programmatically. 

Change Y coordinate when scroll view scrolls.

Fetch comments:

1. Fetch top level comments

2. Fetch user (commenter)

3. Look for comment children (intended comments, if any repeat step 2)

Post comment:

1.Check if allowed (not blocked by OP).

2. Upload comment.

3. Get notification recipients of post.

4. Set notifications.

5. Reload comment tableView with new comment and reset the answerView.

In a user's profile you can find the posts and other optional information.

The name is only displayed in full in your own profile or among friends.

The social media buttons link other social networks.

With the help of the communities you can talk about topics and interests with friends and strangers.

The topics (AddOns) provide an individualization of the community and an additional grouping of the posts within the community.

A discussion view in a Pro/Contra style is optional.

This serves an in-depth discussion of a central thesis. 

The feed displays the posts from the community.

1. Load Views in PageViewController and set delegate for each.

2. Load Community Header.

3. Call delegate when one of the childrens scrollView scrolls. 

4. Adjust header position accordingly.

5. Detect page changes and check if header should be presented.

6. Animate header into place if true. 

The topics (AddOns) can be selected and individualized by every user in the theme store. Through the AddOns, the communities can be designed according to the users' ideas and expanded as needed.

A collection of posts and communities on a topic.

Select already existing posts or create a new post that lands directly in the add-on. 

In this add-on the posts are scrollable horizontally, after selection they are presented as a feed.

A simple question and answer construct to help each other. 

Neutral and anonymous.

Present another community in a clear way, should it be appropriate to the theme.

A collection like the one on the left, but with an underlying YouTube playlist that can be accessed with a tap.

Fetch and show latest posts. Search imagine (limited) if needed.

Fetch addOn items when cell is loaded. Initiate collectionView.

Load addOn feed and show posts. 

1. Fetch questions

2. Fetch answers (children)

3. Animate changes according to selection

1. Fetch community

2. Fetch last 6 picture community posts

3. Initiate collectionView

Fetch addOn items when cell is loaded (like default). Initiate collectionView.

A playlist from Imagine users. 

Organized and convenient, you can select and open individual songs or listen to the playlist as a whole on your streaming service.

Fetch and show latest music posts. 

Search imagine (limited) if needed.

Upload item ID incl. album cover, name and title when selected.

1. Fetch items.

2. Load items.

3. Make header image from first four items.

Case 1: Item tapped:

Animate and load the webView, modify height of addOn. Open title in streaming service if tapped.

Case 2: Playlist tapped:

Open playlist in preferred streaming service.

There are individual settings for the user profile, moderated communities as well as AddOns.

One tableViewController for every case. Easily expandable. (e.g. post settings, coming soon)

Five different cells: Text, Picture, Location, Single Switch and Date Picker.

1. Fetch data of the relevant object.

2. Add different sections and cells, fill in the fetched data and change the description label if needed.

3. Add additional information as footer if needed.

4. Detect change through return tab in keyboard, changed order in the tableView or a selected picture.

5.  Categorize the change through an enum and upload the change to firebase.

The fifth tap is for the Imagine community.

Imagine stands for transparency, so here you can see various information about the network. 

For example, there are current projects and also graphics about our principles.

You can also access the proposals, which are submitted and voted by the users. In this way, we want to encourage users to build the network with us and take responsibility for it.

A FAQ section, settings and areas where we need help can also be found here. 

Load the three sections and two header into the collectionView. Fetch the latest jobOffers and BlogPosts.

Check if already voted, before increasing the vote count.

Load preferred settings out of the phone as user defaults.

The chat is intended for a first communication. 

The use is limited, as there are some features missing, e.g. end-to-end encryption. 

When registering and logging in, the user is guided on a personal level through the data entry and the specifications of the network. 

In the second tab you can discover communities and their new posts.

You can also search Imagine by posts, communities and users.

Fetch the latest picture and GIF posts and display/play them.

Query the database with ">" and "<" for the title and tags, to get a basic search.

Fetch the chats, its user and the last message asynchrouniously.

Animate up to 13 different screens with the different input data.

Posts can be reported or visually marked.

If the content violates the rules, it will be removed.

If a post contains questionable content, it can be visually marked. This makes it clear to users that they should take the underlying information with a certain degree of skepticism.

After launching the app, the user is guided through a short introduction to the network. 

In addition to the advantages of the network, the user is also asked to register in order to take advantage of all the benefits.

Besides the tutorial, there are four info screens within the app.

Polls can be shared with users in the feed.

This allows the administrators or moderators of a community to better understand the users and act on their behalf.

I have been programming intensively for 3 years, almost 2 years of it on Imagine. 

Until the structures were polished and the functions made sense, a lot of things had to be tried, tested, deleted or relaunched. 

I learned my basic Swift knowledge through an Udemy course and deepened it through YouTube & Ray Wenderlich tutorials, a lot of StackOverflow, documentations and more advanced courses. 

Besides small initial projects and about 9 months on a live quiz app called "HYPE" I implemented what I learned directly at Imagine. 

I see my strengths in the handling of Table and CollectionViews and their Cells, due to the numerous uses within Imagine. By now, I especially enjoy UI/UX development. I'm getting better at straightening out complicated views, animating functions and designing them intuitively, that's what excites me the most.

My weaknesses, and therefore those of the Imagine iOS app, lie in the unit tests and the access control declarations of variables.  

I put myself in the foreground here because I am looking for a job. 

One must not and will not forget Matz, who has programmed the Android app, he also gets his page here soon.

Actually, it is intended as a community project anyway, but unfortunately we still lack the community. 🙃