hulika

Author Topic: Site Upgrade *merged*  (Read 32712 times)

Offline Riff_6603

  • Philmusicus Moderatus
  • Moderator
  • *****
Re: Taking PM to the next level.
« Reply #200 on: July 24, 2012, 06:19:21 AM »
a few months ago I did a usability/user experience testing on how to properly and efficiently port a "forum" site into an iOS application.. I used Philmusic as my base example and played around with it on what to port and what not to include, I did a rough sketch design of the app in a mockup screenshots.. (I posted it in the gadgetopolis section for iPhone/iPod thread):

http://talk.philmusic.com/index.php?topic=89128.800









just if ever Sir Jim would pursue an iOS Application for Philmusic  :)

Hi rockophoria! any updates re your app dev? we're excited to see what you came up with since last time. thanks! :wave:

Online rockophoria

  • Philmusicus Addictus
  • *****
Re: Taking PM to the next level.
« Reply #201 on: July 24, 2012, 07:19:54 PM »
Hi rockophoria! any updates re your app dev? we're excited to see what you came up with since last time. thanks! :wave:

yep, I made significant usability changes since my last design, specially on the way we can reply on threads and quoting specific replies.. Im also thinking about a feature on how we can immediately post a photo we took from our camera roll (iPhone/Android) but I think its impossible as Philmusic doesnt have a dedicated server for uploading photos.. so I guess we will stick with tagging them from hosting sites.. or facebook..

ill post it asap..
imma badass!! <funky guitar rift>

Offline Riff_6603

  • Philmusicus Moderatus
  • Moderator
  • *****
Re: Taking PM to the next level.
« Reply #202 on: July 25, 2012, 10:42:22 PM »
yep, I made significant usability changes since my last design, specially on the way we can reply on threads and quoting specific replies.. Im also thinking about a feature on how we can immediately post a photo we took from our camera roll (iPhone/Android) but I think its impossible as Philmusic doesnt have a dedicated server for uploading photos.. so I guess we will stick with tagging them from hosting sites.. or facebook..

ill post it asap..

Social media integration is already in the works. I could check with Qen if we could setup a dedicated server for uploading photos, cannot promise anything though but it's worth a decent try. I'll be tuning in this thread re your updates! Thanks! :wave:

Online rockophoria

  • Philmusicus Addictus
  • *****
Re: Taking PM to the next level.
« Reply #203 on: August 01, 2012, 10:10:28 AM »
Social media integration is already in the works. I could check with Qen if we could setup a dedicated server for uploading photos, cannot promise anything though but it's worth a decent try. I'll be tuning in this thread re your updates! Thanks! :wave:

nice! ill just pass the photo posting for now and will just add it later.. im about to finish the "new thread" and "new poll" posting..
will post the samples soon.  :-D
imma badass!! <funky guitar rift>

Offline Riff_6603

  • Philmusicus Moderatus
  • Moderator
  • *****
Re: Taking PM to the next level.
« Reply #204 on: August 01, 2012, 09:59:21 PM »
nice! ill just pass the photo posting for now and will just add it later.. im about to finish the "new thread" and "new poll" posting..
will post the samples soon.  :-D

nice! we're really excited to see the recent developments you came up with. sakto sa PM v.3 yan! thanks sir!


Offline qen

  • Administrator
  • ******
Re: PM v.3.0 - Taking PM to the next level. Your thoughts matter!
« Reply #205 on: August 02, 2012, 04:01:51 PM »
we need a budget for a new box and for file / song clips uploads, i can setup some amazon s3 integration

but right now my primary concern is really the server, we have a really modest server specs,
even my gaming laptop is 10x more better hahahaha... also we only have like 914mb disk space left

so yeah, [strawberry]! hahaha

it's kinda amazing somehow it can still manage the traffic that the forum gets and of course the forum search too

i propose a meeting hahahaha, sagot ni jim at chette hahahaha :-D

^ is an epic posts  ;)
< bathe in the glory of his awesomeness :cool:
V probably most likely a forum troll lol :P

Offline glassjaw_jc

  • Philmusicus Addictus
  • *****
Re: PM v.3.0 - Taking PM to the next level. Your thoughts matter!
« Reply #206 on: August 02, 2012, 04:25:13 PM »
I think the next logical evolution of PM is going mobile.
Surf's Up!

Offline Riff_6603

  • Philmusicus Moderatus
  • Moderator
  • *****
Re: PM v.3.0 - Taking PM to the next level. Your thoughts matter!
« Reply #207 on: August 02, 2012, 09:50:02 PM »
we need a budget for a new box and for file / song clips uploads, i can setup some amazon s3 integration

but right now my primary concern is really the server, we have a really modest server specs,
even my gaming laptop is 10x more better hahahaha... also we only have like 914mb disk space left

so yeah, [strawberry]! hahaha

it's kinda amazing somehow it can still manage the traffic that the forum gets and of course the forum search too

i propose a meeting hahahaha, sagot ni jim at chette hahahaha :-D

noted. usap muna tayo sa mod board.

Online rockophoria

  • Philmusicus Addictus
  • *****
Re: PM v.3.0 - Taking PM to the next level. Your thoughts matter!
« Reply #208 on: August 04, 2012, 03:44:20 AM »
Here we go.. Im having a hard time trying to figure out how I will translate the "Poll" thread (or if its still necessary to include it in the application port) but while im yet to make I might aswell post those I have already finished.

Please take note that the designs/colors/icons here are not final and for testing purposes only, I paid attention to the UI flow, Usability and User Experience of the application as its important to do so being the application a ported "mobile version" of a fully working "forum website".

First up.. the Springboard where we can see the Philmusic Application Icon:

Next after we initiate the application is the Login Screen, we have 2 options here to either login (existing users) or register (new users):

   

If one choose to register it will take him to the "Terms of Use" and "Registration" Page:

   

will be ask to accept the terms first before one will be able to continue and clicking accept will move to the main registration page:

   

Clicking submit will send the information to the server:

   

A popup message will inform the user that his/her registration is successful and a verification email is sent to complete the registration.. (one needs to click that link first to verify the registration before he/she can use his account)..

If one is an existing user he can immediately log into the application using his credentials..

   

Logging in will take him immediately into the Main Menu:

The main menu shows the section of the main philmusic board, it also shows new personal messages (or unread ones), and will appear as a red badge in the segmented control on the toolbar below.. it will also show a message if you have received or unread messages available:

Pressing the "messages" section of the segmented control will bring you to your "personal messages" screen

   

You can read, reply, delete and manage your messages in this area..

   

You can edit or "swipe to delete" messages in each field, you can also use the standard "pull down to refresh" to check for new incoming messages..

   

   

The third section of the segmented control will be your "Profile Page".. now im still thinking if we are going to give the users the feature to edit his profile here or will require him to just do it in the main website.. altho I think it is best have it as "read only" for now as I think most of the Philmusic users will be acquainted with the website first before using the mobile application.. thus will already have his profile posted even before he can edit or do it in the mobile app. (altho we can still add it, will still depend).

Clicking back the menu we can start browsing the main forum, say by clicking the "Anything Goes".

   

We will see the sections under Anything Goes, and the color of the title represents it if you have visited it already, if its gray it means there are no recent activity, if its in dark orange it means there's new posts and new threads available, checking for updates will be by using the same gesture of "Pull down to refresh".

   

This will refresh the whole Anything Goes section and will fetch new updates from the serves, all texts will turn into dark orange if the system detects multiple activities in all the sections.

   

Clicking a section will take us into its main page that will display all available thread/topics related to that section (like the Hobbies Beta Section).. we can also update it by using the pull down to refresh.. to fetch new replies, new threads, locked threads or deleted threads.

The main thread page under the Anything Goes section will display the "newest" threads and the threads with new replies.. a sub header will display the "paging" of the threads section, here we see "1/11" means we ware in page 1 with eleven total pages.. scrolling up will automatically load the next page to show the succeeding threads until the last page.

   

You can also do a search of a specific thread you want by using the search bar in the list.. this will fetch the keyword from the server or if its already loaded (if you browsed all the pages thus loading all of it) it will show immediately.. (example the "Digital Painting" thread).

You can also click the thread immediately in the search results..

   

Inside the Digital Painting thread will display the replies from old to new (just like the main page), but im thinking about adding a "settings" in the menu page to give users an option to display thread replies "the other way around" or from "newer to older" this will make the user see the latest reply on that specific thread immediately, unlike when we use the "older to newer" display option we still need to "scroll down" to load all the pages until we see the newest reply.. this is a usability hiccup as mobile users wanted "efficiency" when using the Philmusic Mobile App.. they will want to "see immediately" all updates thus we need to give it to them because most of those who will opt to use a mobile version of the forum are those people "on the go" thus they dont have time to spend scrolling up and down just to read the new post and reply to them..

   

Just like the sub thread section we can view the succeeding pages by scrolling down to automatically load the next page of replies (older to newer or newer to older will depend on the user).. we can see here after loading the next page we scroll up the sub header pagination will show "2/11" means we are already viewing the 2nd page of the thread..

Threads with 5 or more replies will show the replies in "preview" mode to maximize list space, you will see a "progressive disclosure" control (down arrow) on each reply which means it can be "collapsed" to see/read the whole reply.. the user can click the "chevron/arrow" (down arrow) to collapse that specific reply.. then you can also click it again to close it..

   

Replying will be simple, you can click the reply icon in the toolbar anywhere in any page you are since every new reply will automatically be displayed on the last page (older to newer) or the first page (newer to older).. clicking the "reply to thread" will be the usual reply but clicking the "reply with quote" will bring you back to the list so you could click the specific reply you wanted to quote..

   

You will notice that once you select a specific reply to quote in the list it will automatically be added on your reply page..

   

After the reply is sent to the server you will automatically be brought to the last page to see your reply (older to newer) or the first page (newer to older).. this will also be initially displayed in "preview" mode to save space and can be read in whole by collapsing it.. (clicking the progressive disclosure arrow).

   

Now on creating a new thread..

You can click the "new thread" icon in the toolbar anywhere or anypage you are in the section.. this will pop up the action sheet that will display the options of either creating a "new topic" or "new poll" or to cancel (unless you accidentally pressed the new thread icon).. creating a "new topic" will bring you to the standard create topic page..

   

Clicking "post" will send the new topic request to the main server to post it.. after that it will display immediately on the first page (under stickies) of the threads section.

   

Clicking the new created topic/thread will show you the author's reply immediately (not a preview) because there is still plenty of space to show it.. unlike when replies started to swarm to a certain number the application will automatically turn all replies into "preview mode" where you need to collapse it by clicking the progressive disclosure button (to save space ofcourse).. but until there is significant replies added the thread will display the replies (up to the 5th reply depending on the size of text) in its "whole" not "preview" version (without the progressive disclosures).

You can also modify your thread by clicking the "Edit" button on the navigation/header bar (above) the "Edit" feature will only be available to users who are the "creators" of the thread, those who are in read only will not see the edit button..

   

Clicking the edit button will give the users option to modify the title or add text, details into the thread (like adding a photo link)..

im also thinking of adding options here to "lock" your page or to "delete" it.. lets say in the classifieds section where in the event that your item is already sold you can edit your thread to either lock or delete it.. but this will depend on the decision of the moderators.. we can add the feature later..

   

After editing your thread (pasting an image link) you can click the "save" button to request the server to update the existing thread with your new details added..

The photo link will immediately display the image you posted (hosted on another site like Facebook or Photobucket).. now this is what I want to make sure if we are going to have our own servers I can add an option to each user to use their phone's "built in camera" to take photos of anything (a guitar for example) and post it immediately in his thread or reply.. the application will automatically scale the photo into standard HVGA (640x480px) to optimized it "display" and "file-size" wise.. but unless we settle wether we will have that resource I will for now make the adding of photos solely "host-based" since we can just add the feature later.. or in version 1.1 of the app  :-D

 

so far this is all I have for now.. im still about the finish the "New Poll" pages.. altho I need feedbacks from you if the Poll is a worthy feature we have to include in the Port? as I dont see the need for a user to post a Poll "on the go".. but I might be wrong..  :-(

also another feature I will add soon is another section on the segmented control titled "new updates" which will show all updates/activities on the threads, discussions and polls you are in.. this will help you see/monitor immediately all replies to your thread.. all replies to threads you are watching etc.. atleast you wont need to browse into the sections just to check updates on your activity..

I also forgot the "Recent Posts" is a very usable section.. im thinking of where to put it.. I can add it up on the main menu when I post my next updated mock ups..

this is a mock up in progress.. this can change anytime depending on the feedback we will have, but "usability" and "user experience" wise? this is my recommendation if ever we are going to push through porting Philmusic into a mobile app.. this is just for the iOS platform.. if ever we are really serious with it we will also need to do the same for the Android platform too (for android users).. which is a totally different user experience.. and will require another round of work:-D

will post updates soon!
« Last Edit: August 04, 2012, 10:14:09 PM by rockophoria »
imma badass!! <funky guitar rift>

Offline KitC

  • Prime Moderator
  • ******
Re: PM v.3.0 - Taking PM to the next level. Your thoughts matter!
« Reply #209 on: August 04, 2012, 12:32:41 PM »
This is great work, rockophoria! Did our admin, qen, get in touch with you already?
Sonar 4.04PE/5.2PE/7.02PE/8.31 PE, Project 5 v2.5.1, EmulatorX 1.5, Cubase SL2, Ableton Live 7.14,  Intel Q6600 MSI P43 Neo 4Gb Crucial Ballistix Tracer DDR2-800, Emu 1820m, Yamaha DSP Factory, Terratec DMX 6fire

Online rockophoria

  • Philmusicus Addictus
  • *****
Re: PM v.3.0 - Taking PM to the next level. Your thoughts matter!
« Reply #210 on: August 04, 2012, 04:54:39 PM »
This is great work, rockophoria! Did our admin, qen, get in touch with you already?

thanks! there's a lot of work to be done, altho I am in constant communication with Riff_6603 when it comes to admin/mod feedbacks..

if ever this will be a very complex application that requires a very experienced application developer (XCode/C++/Java for native and JQuery for webapp) with server side knowledge..  :-\
imma badass!! <funky guitar rift>

Online rockophoria

  • Philmusicus Addictus
  • *****
Re: PM v.3.0 - Taking PM to the next level. Your thoughts matter!
« Reply #211 on: August 04, 2012, 10:22:41 PM »
Here's another update..

I added another segment control "Updates" this will display all updates related to all threads the current user created, engaged to or watching.. this section will fetch all recent activities in the server everytime the user signs in and the user can also "clear" those fetched data anytime to save memory (as uncleared datas will be cached below the new fetched ones).. the user can also refresh the list for new updates by using the "pull down to refresh" gesture.

Clicking each update will automatically bring the user into the related thread..

   

After the update is clicked by the user the link will turn gray on the Updates list to signify it as "read".

   

Will post more updates soon!  :)
« Last Edit: August 06, 2012, 12:56:14 AM by rockophoria »
imma badass!! <funky guitar rift>

Offline Riff_6603

  • Philmusicus Moderatus
  • Moderator
  • *****
Re: PM v.3.0 - Taking PM to the next level. Your thoughts matter!
« Reply #212 on: August 05, 2012, 11:16:24 AM »
thanks! there's a lot of work to be done, altho I am in constant communication with Riff_6603 when it comes to admin/mod feedbacks..

if ever this will be a very complex application that requires a very experienced application developer (XCode/C++/Java for native and JQuery for webapp) with server side knowledge..  :-\

lemme check with the local guys re XCode, C++ and the like. I've seen some of em' lurking in the tech forums every now and then.

Online rockophoria

  • Philmusicus Addictus
  • *****
Re: PM v.3.0 - Taking PM to the next level. Your thoughts matter!
« Reply #213 on: August 05, 2012, 02:14:11 PM »
lemme check with the local guys re XCode, C++ and the like. I've seen some of em' lurking in the tech forums every now and then.

yep, I believe we need a mix resource for development as this is not "App-Specific" alone.. it will require connection to the main server that hosts the forum website.. thus we need the logic to translate all command/connections from the Mobile Application to be recognized by the server.. I dont know if we will create new "command parameters" so that the server will identify if the request is from the "mobile app" or "the main forum site".. this way we will be able to control the application's "limited features" akin to he main site's complete browser-based features.

I recommend an iOS Application Developer (XCode and Objective C / C++) and a Web Developer (HTML5/XHTML/CSS, ASP/PHP with Server-Side Scripting knowledge) unless the Application Developer has "Web Development" background (specially the attributes above) he will need the assistance and server knowledge of the web developer.

Oh an API Developer as well

 :-D :-D
« Last Edit: August 06, 2012, 02:14:15 PM by rockophoria »
imma badass!! <funky guitar rift>

Offline qroon

  • Tanod
  • Prime Moderator
  • ******
Re: PM v.3.0 - Taking PM to the next level. Your thoughts matter!
« Reply #214 on: August 06, 2012, 07:01:23 PM »
Hopefully, this is in addition to an existing forum/regular website and not mobile-centric only.


Semper Erectus
Spur | Helical | Bevel | Hypoid | Crown | Epicyclic

Offline Riff_6603

  • Philmusicus Moderatus
  • Moderator
  • *****
Re: PM v.3.0 - Taking PM to the next level. Your thoughts matter!
« Reply #215 on: August 06, 2012, 07:37:57 PM »
yep, I believe we need a mix resource for development as this is not "App-Specific" alone.. it will require connection to the main server that hosts the forum website.. thus we need the logic to translate all command/connections from the Mobile Application to be recognized by the server.. I dont know if we will create new "command parameters" so that the server will identify if the request is from the "mobile app" or "the main forum site".. this way we will be able to control the application's "limited features" akin to he main site's complete browser-based features.

I recommend an iOS Application Developer (XCode and Objective C / C++) and a Web Developer (HTML5/XHTML/CSS, ASP/PHP with Server-Side Scripting knowledge) unless the Application Developer has "Web Development" background (specially the attributes above) he will need the assistance and server knowledge of the web developer.

Oh an API Developer as well

 :-D :-D

Web developers are easy to find. as for the App and API guys well.. ^-^

Online rockophoria

  • Philmusicus Addictus
  • *****
Re: PM v.3.0 - Taking PM to the next level. Your thoughts matter!
« Reply #216 on: August 10, 2012, 01:43:21 AM »
Web developers are easy to find. as for the App and API guys well.. ^-^

oh thats the problem.. as you can see the web developer would only act as a "consultant" on the server side if ever.. but if you are going to ask me the API Developer and XCode Developer is enough to build this application..

I just want to make sure we have all the right persons in tow.. the web developer is just a "contingency plan" in the event the API Developer is a little "green" enough to translate the programming interface of PM.. (which I doubt because he would not an API Dev if he cant)..  :-D
imma badass!! <funky guitar rift>

Offline Jim Ayson

  • Moderator
  • *****
Re: PM v.3.0 - Taking PM to the next level. Your thoughts matter!
« Reply #217 on: January 16, 2013, 02:00:17 PM »
oh thats the problem.. as you can see the web developer would only act as a "consultant" on the server side if ever.. but if you are going to ask me the API Developer and XCode Developer is enough to build this application..

I just want to make sure we have all the right persons in tow.. the web developer is just a "contingency plan" in the event the API Developer is a little "green" enough to translate the programming interface of PM.. (which I doubt because he would not an API Dev if he cant)..  :-D

Rockophoria are you stil around?? Would like to see what you have done so far.

So far we have gone using the Tapatalk route - they handle forums very well. It's also possible to create a custom app using their API but there are API licensing costs. Would like to see if we can do other forms of apps, not forum related.

Check out the PhilMusic Facebook Page! "Like" us now!

http://facebook.com/philmusic.dotcom

Online rockophoria

  • Philmusicus Addictus
  • *****
Re: PM v.3.0 - Taking PM to the next level. Your thoughts matter!
« Reply #218 on: January 16, 2013, 10:57:11 PM »
Rockophoria are you stil around?? Would like to see what you have done so far.

So far we have gone using the Tapatalk route - they handle forums very well. It's also possible to create a custom app using their API but there are API licensing costs. Would like to see if we can do other forms of apps, not forum related.

Hi Sir Jim, I have temporarily halted the design proposal for a PhilMusic native application as I also agree that Tapatalk does the trick pretty good already.. so what I have posted here so far are the latest designs regarding the said proposal.  :)

And yes I also design UX for mobile applications both on my dayjob and sideline projects.. I have a few free applications available in the apple appstore already and I have another one coming soon.  :-D

« Last Edit: January 16, 2013, 10:59:50 PM by rockophoria »
imma badass!! <funky guitar rift>

Offline Jim Ayson

  • Moderator
  • *****
PM v.3.0 - Taking PM to the next level. Your thoughts matter!
« Reply #219 on: January 16, 2013, 11:27:14 PM »
what are your apps in the app store? would like to check em out!




Sent from my iPhone using Tapatalk
Check out the PhilMusic Facebook Page! "Like" us now!

http://facebook.com/philmusic.dotcom

Online rockophoria

  • Philmusicus Addictus
  • *****
Re: PM v.3.0 - Taking PM to the next level. Your thoughts matter!
« Reply #220 on: January 17, 2013, 12:58:11 AM »
 :)
what are your apps in the app store? would like to check em out!


Sent from my iPhone using Tapatalk

its "PinoyLotto" and "PinoyWeather".. I have another but the devs said the API stopped working its "Smug Movies" all are almost 3 years old in the appstore, and I have another one in development called "ShoutMe" a photo collage designer app with facebook integration, but its still in testing as of now..  :-D
imma badass!! <funky guitar rift>

Offline Jim Ayson

  • Moderator
  • *****
PM v.3.0 - Taking PM to the next level. Your thoughts matter!
« Reply #221 on: January 18, 2013, 09:53:19 PM »
are you indie or with a company?


Sent from my iPhone using Tapatalk
Check out the PhilMusic Facebook Page! "Like" us now!

http://facebook.com/philmusic.dotcom

Online rockophoria

  • Philmusicus Addictus
  • *****
Re: PM v.3.0 - Taking PM to the next level. Your thoughts matter!
« Reply #222 on: January 19, 2013, 12:53:27 AM »
are you indie or with a company?


Sent from my iPhone using Tapatalk

Sir Jim I work as a UX Analyst/Designer for a BPO-IT company as my dayjob, but I also accept projects outside as a hobby specially application, usability and user-interaction consultation and design for mobile applications..

 :-D :-D
imma badass!! <funky guitar rift>