upframe/upframe.io

🦄 Connecting first-time founders to mentors in the tech industry.

upframe.io's Issues

Settings Screen - Account Tab

This is the account tab, where you can change information regarding your account like email change and password

Mentor Screen - Meetup Popup Component

This component is what you will see once you press the time schedule you wanna ask your mentor. This small popup is used to get some more information about the meetup.

Settings - Public Tab - Upload new picture button thinner font

Make the font thinner

People - Free time slots shortened days should only be 3 letters

Search front end routing

We are redirecting popular tags to a /search/ link. We have to handle it to display the correct mentors.

Settings - Public Tab - Text inputs should have different CSS values

font-size: 1.2 rem
padding: 0.9 rem

Delete old photo when new one is uploaded

Right now we are allowing photos of the same mentor with different extensions to stay around in our platform. This means that if a mentor upload a picture with the format: selfie.jpg and then later changes to another one called selfie.png both of these files will stay on our platform. This only happens with different extensions.

To do this we need to:

• - Save a user's photo somewhere in our DB (the file name)
• - When the user uploads a photo, get the current file name, ...
• - ... delete it,
• - and finally proceed like we are already doing

People - Free time slots should separate hours and minutes with : not .

Big Ass Photo at the Settings Page

Onboard Screen

This is the first view invited mentors will have of our application. We will walk them over a process of onboarding with tabs.

Mentor meetup accept

Front end route to handle email sent to mentors to confirm a meetup

Onboard Screen - Welcome Tab

This is the first tab where we welcome our mentor and ask them for their unique id

Settings Screen - Public Tab

This is the public information settings.

Settings Screen - Sync Tab

Here is where you can sync your calendar and add free time.

Onboard Screen - Password Tab

Here is where the mentors will be able to set their password

Cookies.js Linting -> Travis build fails

Due to some linting errors in Cookies.js , our Travis build is failing (it interprets lint errors as a must stop in production). We have two possible fixes:

1. Fix linting - Which will lead to unexpected behaviour since we are changing Regex
2. Change the module altogether. I think we can make a simpler one

Settings Screen

This screen will have 3 tabs. All we have to do is put them in the correct position and switch between them.

Non critical asset prefetching

Using this with #42 we can make sure that the website's experience remains smooth while different packages are fetched. The idea is that while the user is on one page we have already prefetched the next ones.

If we implement this correctly with #42 and #17 we will have the best possible experience

The logo we're using is not updated

The updated logo for our navbar is on Slack.

People - Request button is too big

It should have the same size as other buttons

People - free time slots in mobile should be same size as computer

Mentor Screen

This is basically the mentor page. We get to see their information and free time. Once you press that free time we will use a different component (the Popup) to finish scheduling the meetup.

People - Free time slots font size

Use the font sizes in Zeplin

Onboard Screen - All Done Tab

We need to congratulate them on registering! A small confetti effect or something like that will be an interesting feature!

Service Worker

After the whole application works by itself we need to integrate caching and a service worker. We want this website to feel like a real app and it must behave offline mobile first.

Settings - Public Tab - Spacing between text on the right of the profile pic

People - Request button should not have the animation it currently has

People - Around 771 pixels width expertise tags have a weird balloon format

People - Missing location small icon

On the left of the location

Change from Google Analytics to a privacy focused platform

Adblock engines block requests for Google Analytics because these kind of services create a user profile and own the data of your analytics. This means that they are later used for target advertising.

If we want our analytics to work anywhere and have everyone onboard we need to switch to a privacy focused one like https://matomo.org/. Food for though. (Keep in mind 30% of people use an ad blocker so we are missing out on our users.)

People - Profile pic has radius

It should have 2px radius

Main Screen - Right Side Ad

This will have multiple purposes depending on what we want to display. For now let's just focus on user research and the spotify thing

People - Separation line should be a little bigger

Its width must be the line between the left of the profile picture and the right margin of the bio text box

'Este mentor não existe' page keeps loading before a profile loads

When a user goes to https://connect.upframe.io/malikpiara an error page is loaded before. What's happening there? @ulissesferreira @fabiofcferreira? Can we fix it?

Settings - Public Tab - Spacing between under profile pic and profile pic

Settings - Public Tab - Input texts should have upper case on first letter of words

People - Around 681 px width the mentor's profile pic and text are not formatted correctly

People - profile pic smaller size

It should have
min-width: 12 rem
max-heigh: 12 rem

Events from different calendars have the same color

In order to improve the user experience and have the mentor spend less time inside our platform we need to make a distinction between the free slots and the other events.

People - Free time slots' AM and PM should be upper case

Settings - Public Tab - Distance from Navbar to profile pic

The distance should be 36px.

Order of the time slots is incorrect

Login Screen

Simple login screen. Where the user can login.

Main Screen - Popular Tags Component

Some popular tags to save time when people want to search for common topics

Main Screen

The first screen people will see when they tune in @ connect.upframe.io. This screen consists of 4 sub components that need to be placed in their correct positions. The challenge here is more about responsiveness and placing rather than functionality (that will happen at the sub component level)

Make mentor photos only accessible by connect.upframe.io

Right now we are generating public links when a mentor upload a photo to our platform. Instead of allowing it to be accessible by anyone who has a link we should create a restriction to Connect's domain.

Main Screen - Mentor List Component

A functional component that can receive an array of mentors from our API and load them to show the search results. Here we need to use some optimization techniques since we don't want to load an enormous list of cards... See https://reactjs.org/docs/optimizing-performance.html "Virtualize Long Lists"

People - Mentor's bio text needs a lot of work

Use Malik's settings in Zeplin. (Only those that apply)

Main Screen - Search Bar Component

People will be able to search for mentors using a search bar. This search bar will use our API's search endpoint to retrieve recommendations as the user is typing. We need to be smart here, we can't have a google-level search speed (limited hardware and cashflow on our side) but we also want a pleasent experience. We can fine tune the time the user stops writing and the search to create the illusion that we are as good as google 😆

React Code Splitting

Right now all our code is being distributed across diferent javascript files using the default webpack config. We want to improve the way the website loads providing a quick fetch for the critical assets and only later loading (prefetching) different pages.

If we do this correctly we can improve the two following metrics:
-> First Meaningful Paint
-> First Interactful Pain
-> Total data usage on the website