Friday, August 12, 2016

Work, work, work

What have we been doing for the last few weeks?

We promised to keep you updated on our work progress, so here is the first post about the development of the platform!

As you have already seen on www.speaqwith.me and our Facebook page, we are building up a new design for our landing page, social media channels, and later, for the app itself. The first thing that emerged in this design process was - of course - the logo. The SpeaQ-“Q” and its color gradient represent for us the fun, friendly and diverse range of conversations that you will have when you speaq to people on the app. You can see it now being integrated into all of the channels where we are present online. Of course this colorful logo on its nice dark blue background isn’t just for social media, and these elements will also play an important role in the app design.


And speaking of the app design, well making a logo is one thing, but creating an entire cohesive look and feel for the app is another. So before we set anything in stone, we first went looking for a loooooot of inspiration and started brainstorming to decide on what we wanted our app to be. What should it look like? What does it represent? What are the main features? Is it intuitive? These were the kind of questions we were asking ourselves.

After this soul-searching it was time to get to work, so we rolled up our sleeves and started drawing paper prototypes. Yes, we actually drew everything first, then discussed and tweaked them until we had a version that we could digitize.

The first design idea to be digitized was the general outlines for a top bar and a side bar, which would work as the main navigation. With colors added in, elements ordered into pixel perfect rows, and the right fonts we were finally able to see what the platform would actually look like. Next came designs for the actual pages that you can visit and interact with on the app. So far in our first iteration here is what we’ve got:
  •        A profile page for users where you can also list your native language and the languages you are  currently learning,
  •           a “people” page, where you can browse or search for other users and get in touch with them,
  •           a messages page where you can start your text, voice and video chats,
  •         a page for “channels” which would be like little forums for specific interests (e.g. Spanish,  Mandarin, soccer, travelling)
  •           some kind of language learning tools that you can use outside of the chats
  •           and last but not least your settings to personalize your experience on SpeaQ With Me.

After this step, we sat down with Christian, our developer and created a routing map with all the data needed to support these pages. As we go over the designs together, sometimes we get an “easy, I can do that” and other times we hear “Nope. That is not possible. But I can do it this and that way”, so we have to change plans and adjust.

Which is what the whole process of designing is all about, right? Adjusting, changing and scraping old plans for new ones. So after giving you a long wordy explanation about our design process up to this point, we figured we should finish with some pictures. So below you can see one transition from paper prototype to digital sketch, to finished HTML.

Take these pictures as a preview of how the app could look like. It could still change before you are able to log into it and experience it yourself. But we really wanted to give you guys a sneak peek of what we’ve been up to.













We hope you liked this little insight, as there is more to come.

So, stay tuned and we'll speaq to you soon!

No comments:

Post a Comment