LinkedIn: Reader Page/ In-Mail Profile
This past summer, I was fortunate enough to intern at LinkedIn as a User Experience Designer on the Mobile Team. During my three months I was able to work on several neat projects. Here, I talk about my experience working the Reader Page on the mobile app as well as exploring ideas to include an In-Mail Profile top cards.
During my summer I worked on the following things:
- Endorsements on Mobile Feed (NUS)
- Groups on LinkedIn
- On-boarding Research
- Reader Page explorations
- In-Mail Profile Top Card explorations and interactions
The Reader Page
Initially, the Reader Page project started out as a need to integrating advertising in articles from external content sources. I was able to create a finalized spec version of the integration that was then sent to developers. However, later I expand on this to Reader Page and explore ways to improve the overall reading experience.
The InMail Profile project started out as a project to fix a toaster animation that was conflicting with avid user speed while they were flipping through multiple connection requests. This led to explorations that made an effort to include a profile card at the top of LinkedIn messages to provide better information for users who are looking through their connections requests. The profile card notion was something that was already in the works for redesigning the profile page, and I saw it as an opportunity to extend that treatment to in-mail messages as well.
1. Reader Page
The Reader Page on LinkedIn's mobile app is a reading page that allows external source articles to be viewed in a specific visual way that is inline with LinkedIn's app. One of my tasks was to incorporate an advertisement into this reading view. My goal was to add it in such a way where it distinguished itself from the article but was also visually appealing such that it would not disturb the experience of reading the article.
Something that I also played around with was adding a subtle animation to the advertisement that would make it more intriguing, but due to advertisement alteration restrictions, the animation could not be used. Additionally, the animation might be considered too distracting while reading a desired article.
After working on the advertising spec, it was suggested to reexamine the way the reader page was constructed as a whole especially since LinkedIn was making efforts to integrate Pulse's designs into the mobile app. Pulse is an article app that LinkedIn had recently acquired, and the LinkedIn mobile app was interested in integrating their reader view style with LinkedIn. Based on research and examining other treatments of article headers, I came to a few design solutions.
Variations in Reader Page: Influencer/Publisher
Something that was different about LinkedIn's reader view was the fact that there are variations in the types of articles LinkedIn has. LinkedIn has Influencer Posts that users can follow, and also a large pool of publishers. Something that was important was keeping the follow button in the header of the Influencer Post, as this was an important feature. This proved to be a challenge due to the limited space in the header. Part of my explorations involved integrating interactions that could slightly expand the header space for the necessary 'follow' button when it was needed. Once clicked, the button would truncate, and the article or other information would take its place.
In order to come to my final mock variations, I researched other reader page views across different apps and also throughout LinkedIn's products. I noticed that a lot of the headers were using gaussian blur as a way to add a color wash background for article headers, and profile headers. This was something that was prominent in Conan, LinkedIn's new Ipad release at the time. I additionally took note on how Conan and Pulse were using the header space to organize various information: influencer "follow" buttons, date of articles, publishers, authors, etc. This research led me to select the necessary information for a mobile perspective.
My process consisted of first researching other apps with clear reader pages (i.e. Pulse, Flipboard). I the then looked at various reader views and heading hierarchy across LinkedIn's products. Lastly, I iterated and selected a few that I felt strongly accomplished my goals. The next steps would be user testing.
2. In-Mail Profile
The second thing that I worked on started was a project that involved redesigning a toaster interaction that proved to be too slow for fast passed mobile users. An interesting thing about this project was that it evolved into a larger initiative where we questioned that actual content on the page for each connection the toaster appeared.
I played around with various types of toaster that would provide the feedback necessary for the user. I even looked at how other apps treated "accept" and "reject" interactions. One app that had an interesting and quick interaction was Tinder. It may sound humorous but their effortless swiping from left to right could be a potential way to amend the initial issue.
Something that I discovered in this process of amending the toaster interaction was the fact that there was a lack of information in the actual connection request screens. This made it so that whenever one would receive a connection request,very little was known about the actual person requesting the request. Additionally very few custom wrote a message. This was an opportunity to provide additional information in the header. Something I played around with was the idea of having certain information highlighted depending on how relevant the information was. If the connection requester worked at Amazon with you two years ago, one is more likely to accept that invitation due to this information. Changing that call out meta data in such a way where it is relevant serves to be most beneficial for the user who is looking through their connection requests.
For the three months that I was at LinkedIn, I had a wonderful time. I learned so much from my mentors and managers, made great friendships with fellow interns, and I enjoyed the Bay Area in all its glory. I would like to thank everyone at LinkedIn for a welcoming me so wholeheartedly. I have grown so much as a designer because of them.