in Projects

QvoGente.com Website

This project’s expected functionality and deliverables:

Qvogente.com is an online place to post at the local level; eg Which walmart parking lot in any given city serves the best tamales. A website similar to Craigslist but now specifically Mexican-oriented.. For example, where to stay if you are traveling, what is happening in each city.

Website requirements:

  1. Open-source foundation (for community on community platform),
  2. Multi-city functionality,
  3. No-brainer registration for participation (posting),
  4. Mobile-first streamlined approach,
  5. Colorful and Spanish-feel (design),
  6. Design layout similar to cork boards commonly found outdoors of Mexican stores and supermarkets,
  7. Display tweets from all of Twitter using specific keywords,
  8. Display specific videos from YouTube,
  9. Social Media share buttons to share almost any posting or page,
  10. City-specific header/banner images

Solutions:

  1. Future-proofing the maintenance (considering developers with little to advanced skills) of the platform foundation geared towards choosing WordPress Multisite.
  2. Each city is under a site within a subdomain, eg: Sacramento is found at http://sacramento.qvogente.com/
  3. Front-end posting first requests email and password from the user to sign-up and immediately takes him/her to a form for Publishing an Ad to any single city in the nation.
  4. Considering the target audience, the website CSS’s design is responsive from mobile width and auto-adjusting as the screen size increases.
  5. Color Palette:
    █ #fff9e3 █ #dd3333 █ rgba(42, 77, 97, 0.8) █ #a1d274 █ #1e73be
  6. Considering the audience’s conventional method of posting ads outside of Mexican businesses, the website layout features an ‘online cork board’ with sections in a three-column layout categorized into distinct boxes such as ‘Events’, ‘Neighborhood Announcements’, ‘Financial Literacy’, ‘For Sale’, and most importantly ‘Local Civic Action’.
  7. Utilized Twitter’s API to request tweets using specific hashtags and keywords such as #NOT1MORE etc.
  8. The default widget provided by Google YouTube makes too many external requests, so I opted for using a .js that first pulls a video’s thumbnail from Google servers to display on this website. Only when the image thumbnail is clicked on by the user will the widget make its usual external calls. This reduced the website load time tremendously.
  9. Made html-only share buttons, again reducing the amount of external calls to Facebook, Twitter, Linkedin etc.
  10. Each subdomain that hosts a specific city in the nation displays in its header/banner a distinct image (for example the page on Sacramento shows the city’s iconic Tower Bridge across the Sacramento River while each other city subdomain displays a self-iconic representational image of its own city).

Snapshot of Homepage: